Scribd Logo
Cargar

¡Te damos la bienvenida a Scribd!

  • 544 vistas

    Ejercicios DOM

    Cargado por

    kiring
    Este documento describe 13 ejercicios sobre el uso de DOM (Document Object Model) en JavaScript. Los ejercicios cubren temas como recorrer el árbol DOM de una página, acceder a nodos de diferentes formas, crear y eliminar nodos, insertar nodos en una página cargada, modificar estilos CSS, mostrar y ocultar contenido al hacer clic en enlaces, y dinámicamente agregar elementos a una lista al hacer clic en un botón.

    Copyright:

    © All Rights Reserved
    Descargue como DOCX, PDF, TXT o lea en línea desde Scribd

    Ejercicios DOM

    Cargado por

    kiring
    544 vistas4 páginas
    Este documento describe 13 ejercicios sobre el uso de DOM (Document Object Model) en JavaScript. Los ejercicios cubren temas como recorrer el árbol DOM de una página, acceder a nodos de diferentes formas, crear y eliminar nodos, insertar nodos en una página cargada, modificar estilos CSS, mostrar y ocultar contenido al hacer clic en enlaces, y dinámicamente agregar elementos a una lista al hacer clic en un botón.

    Título original

    Ejercicios DOM (1)

    Derechos de autor

    © © All Rights Reserved

    Formatos disponibles

    DOCX, PDF, TXT o lea en línea desde Scribd

    ¿Le pareció útil este documento?

    ¿Este contenido es inapropiado?

    Este documento describe 13 ejercicios sobre el uso de DOM (Document Object Model) en JavaScript. Los ejercicios cubren temas como recorrer el árbol DOM de una página, acceder a nodos de diferentes formas, crear y eliminar nodos, insertar nodos en una página cargada, modificar estilos CSS, mostrar y ocultar contenido al hacer clic en enlaces, y dinámicamente agregar elementos a una lista al hacer clic en un botón.

    Copyright:

    © All Rights Reserved
    Descargue como DOCX, PDF, TXT o lea en línea desde Scribd
    Descargar como docx, pdf o txt
    544 vistas4 páginas

    Ejercicios DOM

    Cargado por

    kiring
    Este documento describe 13 ejercicios sobre el uso de DOM (Document Object Model) en JavaScript. Los ejercicios cubren temas como recorrer el árbol DOM de una página, acceder a nodos de diferentes formas, crear y eliminar nodos, insertar nodos en una página cargada, modificar estilos CSS, mostrar y ocultar contenido al hacer clic en enlaces, y dinámicamente agregar elementos a una lista al hacer clic en un botón.

    Copyright:

    © All Rights Reserved
    Descargue como DOCX, PDF, TXT o lea en línea desde Scribd
    Descargar como docx, pdf o txt
    Está en la página 1de 4

    Ejercicios DOM

    Ejercicio 1: Realizar un script que recorra y muestre con un alert de


    JavaScript, cada tipo de nodo del árbol de una página HTML, que
    previamente haya creado.

    Ejercicio 2: Poner ejemplos de las distintas formas de acceder a un nodo en


    una estructura de árbol.

     Con la ruta completa.


     A partir de un nodo, al primer y al último hijo.
     Como un vector.
     A través del nombre de la etiqueta y accediendo a la posición del
    vector.
     A través del nombre del elemento.
     A través del id del elemento.

    Ejercicio 3: Describir los pasos para crear y eliminar un nodo tipo element,
    que tiene un valor de texto.

     Crear:
    o Crear nodo tipo element.
    o Crear nodo tipo texto.
    o Añadir al tipo element el nodo tipo texto.
     Eliminar:
    o Buscar el nodo a eliminar.
    o Eliminar a través de la referencia del padre.

    Ejercicio 4: Describir cómo realizar los pasos para insertar un nodo en el


    árbol, teniendo en cuenta que la página está cargada completamente.

     Comprobar que está cargada la página.


     Añadir el nodo.
    Ejercicio 5: A partir de la página web proporcionada y utilizando las
    funciones DOM, mostrar por pantalla la siguiente información:

     Número de enlaces de la página


     Dirección a la que enlaza el penúltimo enlace
     Numero de enlaces que enlazan a http://prueba
     Número de enlaces del tercer párrafo

    Ejercicio 6: Crea esta lista de 3 enlaces, al pasar el ratón por encima, muestra
    la dirección a la cual apuntan en un cuadro de texto (input).

    Ejercicio 7: Crea 3 botones, al hacer clic, mostrar el valor mostrado en el


    botón en un cuadro de texto (input).

    Ejercicio 8: Crea 3 botones, al hacer clic, aplicar un fondo de página


    diferente.

    Ejercicio 9: Modifica los estilos que se enumeran a continuación:

     Aumenta el tamaño de la fuente de toda la página


     Tamaño normal
     Cambia el color del fondo
     Color normal
     Aumenta el tamaño de la fuente solo de esta sección
     Tamaño normal
     Cambia el color del fondo de esta sección
     Color normal
     Cambia el tipo de fuente empleada en esta sección al situar el ratón
    encima de este vínculo

    Ejercicio 10: Realizar el código JavaScript para que cuando se pinche sobre el
    enlace se muestre completo el contenido de texto. Además, el enlace debe
    dejar de mostrarse después de pulsarlo por primera vez. (Copiar un texto
    cualquiera en la página y dejarlo oculto).

    Ejercicio 11: Realizar un script que cuando se pinche sobre el enlace “Ocultar
    contenidos” se oculte el texto y que en el enlace ponga “Mostrar contenidos”.
    Al pulsar “Mostrar contenidos “se muestre completo el contenido de texto.

    * NOTA: Versión2. Realizar el mismo ejercicio anterior pero ahora en la


    página se muestran 3 bloques de texto como el del ejercicio anterior.
    Ejercicio 12: Realizar un script que cuando pulsemos en la opción otro se
    muestre el editor de texto.

    Ejercicio 13: Realizar un script para que se añadan nuevos elementos a la lista
    cada vez que se pulsa sobre el botón.

    También podría gustarte