Ejercicios resueltos de JavaScript - Página 6

Curso de JavaScript desde cero a máster

En esta página tienes numeradas todas las soluciones a los ejercicios realizados durante todo el curso. Si te quedan dudas o tienes un resultado diferente, déjame un comentario, ya que a veces, un ejercicio puede tener muchas posibles soluciones.

Soluciones de ejercicios JavaScript - Página 6

    Capítulo 51

  1. Este ejercicio es libre, haz las pruebas que crear necesarias hasta dominar perfectamente la lección del capítulo 51.
  2. Capítulo 52

  3. Se trata solo de obtener la colección HTML de todos los td, que son todas las celdas que contienen datos en el cuerpo de la tabla (<tbody>) y excluímos de paso a los datos del <thead> (cabecera de tabla).
  4. Código JavaScript

    let pais = document.getElementsByTagName("td")[0].innerHTML;
    console.log(pais);

    terminal Resultado en la consola terminal

    Egipto
  5. Aquí es lo mismo, solo tienes que saber en que posición se encuentra Japón. Para saberlo, no te guíes de la tabla cargada en el navegador. Mira el orden de arriba a abajo en la página HTML.
  6. Código JavaScript

    let pais = document.getElementsByTagName("td")[12].innerHTML;
    console.log(pais);

    terminal Resultado en la consola terminal

    Japón
  7. Más de lo mismo.
  8. Código JavaScript

    let pais = document.getElementsByTagName("td")[19].innerHTML;
    console.log(pais);

    terminal Resultado en la consola terminal

    Nueva Zelanda
  9. Tengo que aclarar algo en este ejercicio. Esta forma de hacer esto, no tiene sentido, ya que es muy poco óptima y he tardado mucho más en escribirlo de lo que tardaría haciendo esto mismo con un string sin utilizar nada más. Sin embargo, esta es la solución más sencilla con lo que he enseñado hasta aquí. Veremos mejores formas de hacer esto.
    Otra cosa, recuerda que los backticks (acentos abiertos (``)) muestran los valores preformateados de las variables y el texto que escribas. Por presentación, he separado la línea larga en dos. Por este motivo, lo he realizado con comillas y con backticks, no por nada en especial.
  10. Código JavaScript

    let mexico = document.getElementsByTagName("td")[1].innerHTML;
    let argentina = document.getElementsByTagName("td")[6].innerHTML;
    let colombia = document.getElementsByTagName("td")[11].innerHTML;
    let peru = document.getElementsByTagName("td")[16].innerHTML;
    
    console.log("Los países de América en la tabla, son " +
    `${mexico}, ${argentina}, ${colombia} y ${peru}.`);

    terminal Resultado en la consola terminal

    Los países de América en la tabla, son México, Argentina, Colombia y Perú.
  11. Sabiendo que la fila 3 empieza en la celda 10 (Marruecos), podemos crear una HTMLCollection de los elementos <td>. En el bucle especificamos los números de inicio y salida (10-14) y le pasamos los valores de i a la colección junto con la propiedad innerHTML.
  12. Código JavaScript

    let paises = document.getElementsByTagName("td");
    
    for(i=10;i<=14;i++){
    	console.log(paises[i].innerHTML);
    }
    

    terminal Resultado en la consola terminal

    Marruecos
    Colombia
    Japón
    Italia
    Samoa

    Capítulo 53

    Este capítulo no tiene ejercicios.

    Capítulo 54

  13. El ejercicio consiste en utilizar una tabla cualquiera diferente a la de la unidad. Si has conseguido iterar una fila y una columna, lo has conseguido.
  14. Capítulo 55

  15. Creamos, modificamos y mostramos los párrafos en el documento:
  16. Código JavaScript

    // Se crean los tres párrafos.
    const parrafo1 = document.createElement("p");
    const parrafo2 = document.createElement("p");
    const parrafo3 = document.createElement("p");
    
    // Se les da un valor innerHTML.
    parrafo1.innerHTML = "Párrafo 1";
    parrafo2.innerHTML = "Párrafo 2";
    parrafo3.innerHTML = "Párrafo 3";
    
    // Se muestran en el documento.
    document.body.appendChild(parrafo1);
    document.body.appendChild(parrafo2);
    document.body.appendChild(parrafo3);

    Resultado en el navegador

    Párrafo 1
    Párrafo 2
    Párrafo 3
  17. En este ejercicio, he sido bastante malo. Seguramente, hayas caído en mi pequeña trampa y hayas intentado hacer esto creando el elemento "p" y el elemento "b", para luego incluirlo. Piensa que estas son las situaciones de lógica a las que te tendrás que enfrentar muchas veces con programación. Recuerda, que ya dije (capítulo 8) que si escribías etiquetas html sobre el document, este las interpretaba como html. Además, las comillas dobles deben aparecer en la frase, lo he dicho en el enunciado.
  18. Código JavaScript

    // Se crea el párrafo.
    const parrafo = document.createElement("p");
    
    // Se les da un valor y dentro, escapamos etiquetas HTML.
    parrafo.innerHTML = '"La palabra <b>JavaScript</b> está resaltada."';
    
    // Se muestra en el documento.
    document.body.appendChild(parrafo);

    Resultado en el navegador

    "La palabra JavaScript está resaltada."

    Capítulo 56

  19. La respuesta correcta es la número 2 (onmousemove).
  20. La respuesta correcta es la número 3 (onmouseenter).
  21. La respuesta correcta es la número 4 (onmousedown).
  22. La respuesta correcta es la número 3 (ondblclick).
  23. La respuesta correcta es la número 4 (oncontextmenu).
  24. La respuesta correcta es la número 1 (onclick).
  25. La respuesta correcta es la número 3 (onmouseleave).
  26. La respuesta correcta es la número 1 (onmouseover).
  27. La respuesta correcta es la número 3 (onmouseout).
  28. La respuesta correcta es la número 4 (onmouseup).

Páginas


Suscríbete a mi canal de YouTube para apoyarme

Si te ha gustado este curso y crees que el trabajo merece la pena, te agradeceré eternamente que te suscribas a mi canal de YouTube para apoyarme y que pueda seguir haciendo cursos gratuitos.

Además, si te encanta la programación, tienes un montón más de cursos gratuitos para ver.

No solo eso, podrás participar enviándome comentarios con tus sugerencias para temas específicos o cursos completos o incluso las dudas que tengas y las intentaré ir resolviendo en los cursos que estén todavía abiertos.


Comentarios

Si te quedan dudas sobre el temario, sobre JavaScript, o cualquier otra cosa relacionada o simplemente quieres agradecer, aquí tienes tu sitio para dejar tu granito de arena. Gracias por tus comentarios y por darle vida a este sitio web.