« anterior próximo »
Páginas: [1]

Autor Tema: JavaScript ejercicios resueltos bucle for document.getElementsByTagName CU01131E  (Leído 2064 veces)

cristiannd

  • Sin experiencia
  • *
  • APR2.COM
  • Mensajes: 24
    • Ver Perfil
JavaScript ejercicios resueltos bucle for document.getElementsByTagName CU01131E
« en: 20 de Abril 2020, 00:29 »
Solución propuesta para los ejercicios de la entrega CU01131E del tutorial básico de programación web con JavaScript de aprenderaprogramar.

Citar
1) Crea una función que pida una palabra al usuario y usando un bucle for y el método charAt, muestre cada una de las letras que componen la entrada.

Código: [Seleccionar]
<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <title>Ejercicio CU01131E</title>
    <script>
        function palabraElegida(palabra){
            for (i = 0; i < palabra.length; i++){
                document.write('Letra ' + Number(i+1) + ': ' + palabra.charAt(i) + '<br>');
            }
        }
    </script>
</head>
<body>
    <script>
        palabraElegida(prompt('Escribe una palabra'));
    </script>

</body>
</html>


Citar
Crea una función denominada mostrarContParrafos, que utilizando el acceso a los nodos del DOM de tipo párrafo, muestre el texto que contienen. Por ejemplo para el código de ejemplo visto anteriormente el resultado debería ser: Párrafo 1 contiene: manzana; Párrafo 2 contiene: pera. Párrafo 3 contiene: fresa. Párrafo 4 contiene … (etc., hasta que no haya más párrafos).

Código: [Seleccionar]
<!DOCTYPE html>
<html>
    <head>
        <title>Ejercicio CU01131E</title>
        <meta charset="utf-8">
        <style type="text/css">
            body {background-color:white; font-family: sans-serif;}
            p {font-size: 24px; color: maroon; float: left; margin:10px; border: solid black; padding:10px;}
            .boton{padding:15px; width: 330px;  text-align:center; clear:both;
            color: white; border-radius: 40px; background: rgb(202, 60, 60);}
            .boton:hover {background: rgb(66, 184, 221);}
        </style>
        <script type="text/javascript">
            function mostrarContParrafo(elemento){
                var parrafo = document.getElementsByTagName(elemento);
                var msg = '';
                for(i = 0; i < parrafo.length; i++){
                    msg = msg + ('Parrafo ' + Number(i+1) + ': ' + parrafo[i].firstChild.nodeValue + '\n');
                }
                alert(msg)
            }
        </script>
    </head>
    <body>
        <h1>Portal web aprenderaprogramar.com</h1>
        <h2>Didáctica y divulgación de la programación</h2>
        <div style="width:500px; float:left; margin-bottom:30px;">
            <p>Manzana</p><p>Pera</p><p>Fresa</p><p>Ciruela</p>
            <p>Naranja</p><p>Kiwi</p><p>Pomelo</p><p>Melón</p>
            <p>Sandía</p><p>Mango</p><p>Papaya</p><p>Cereza</p>
            <p>Nectarina</p><p>Frambuesa</p>
        </div>
        <h2 class="boton" onclick="mostrarContParrafo('p')">Pulse aquí</h2>
    </body>
</html>
« Última modificación: 24 de Septiembre 2020, 18:24 por Ogramar »
En línea

Ogramar

  • Moderador Global
  • Experto
  • *******
  • Mensajes: 2662
    • Ver Perfil
Re:JavaScript ejercicios resueltos bucle for document.getElementsByTagName CU01131E
« Respuesta #1 en: 24 de Septiembre 2020, 18:24 »
Buenas, ambos ejercicios realizan lo que se pedía. Comentar que en el ejercicio 1 la estructura del código (un script directamente dentro del body) no es la que se utiliza en los ejemplos del curso. También en el ejercicio 1 se utiliza document.write, que tampoco es utilizado en los ejemplos del curso. Salu2
En línea
Páginas: [1]
« anterior próximo »
 

Sobre la educación, sólo puedo decir que es el tema más importante en el que nosotros, como pueblo, debemos involucrarnos.

Abraham Lincoln (1808-1865) Presidente estadounidense.

aprenderaprogramar.com: Desde 2006 comprometidos con la didáctica y divulgación de la programación

Preguntas y respuestas

¿Cómo establecer o cambiar la imagen asociada (avatar) de usuario?
  1. Inicia sesión con tu nombre de usuario y contraseña.
  2. Pulsa en perfil --> perfil del foro
  3. Elige la imagen personalizada que quieras usar. Puedes escogerla de una galería de imágenes o subirla desde tu ordenador.
  4. En la parte final de la página pulsa el botón "cambiar perfil".