Autor Tema: Ejercicios for JavaScript (bucles) Saber tamaño de array con length (CU01131E)  (Leído 369 veces)

DRANXZ88

  • Avanzado
  • ****
  • Mensajes: 356
    • Ver Perfil
Ejercicios resueltos de for JavaScript (bucles) Saber tamaño de array con length. Break (detener bucle). Ejemplos, ejercicio del curso de programación JavaScript CU01131E.

html
Código: [Seleccionar]
<!DOCTYPE html>
<html lang="es">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>JavaScript</title>

    <link rel="stylesheet" href="css/estilos5.css">
</head>

<body>
    <h1>Portal web aprenderaprogramar.com</h1>

    <h2>Didáctica y divulgación de la programación</h2>
    <div style="width:450px;">

        <form name="formularioContacto" class="formularioTipo1" method="get">

            <h2>Escriba un palabra:</h2>

            <label for="palabra"><span>Palabra:</span> <input id="palabra" type="text" name="palabra" /></label>

        </form>

    </div>
    <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>
    <h3 class="boton" onclick="dividirPalabra(document.getElementById('palabra').value);">Deletrear palabras</h3>
    <h3 class="boton" onclick="mostrarContParrafos('p');">Mostrar texto</h3>
    <script src="js/funciones6.js"></script>
    <script>

    </script>
</body>

</html>
Css
Código: [Seleccionar]
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);
}

.formularioTipo1 {
  margin: 10px;
  padding: 1px;
}
label {
  color: maroon;
  display: inline-block;
  padding: 5px;
}
.formularioTipo1 input {
  background-color: yellow;
  width: 250px;
  height: 20px;
  border-radius: 5px;
}
Función del ejercicios 1
Código: [Seleccionar]
function dividirPalabra(palabra) {
  for (var i = 0; i < palabra.length; i++) {
    alert("Letra " + (i + 1) + " : " + palabra.charAt(i));
  }
}
Función del ejercicios 2
Código: [Seleccionar]
function mostrarContParrafos(elemento) { 
  var elementosObtenidos = document.getElementsByTagName(elemento);
  for (let index = 1; index < elementosObtenidos.length; index++) {
    alert(
      "Párrafo " +
        index +
        " contiene: " +
        elementosObtenidos[index - 1].firstChild.nodeValue
    );
  }
}
« Última modificación: 25 de Julio 2021, 18:35 por Ogramar »

Ogramar

  • Moderador Global
  • Experto
  • *******
  • Mensajes: 2635
    • Ver Perfil
Buenas, para quien revise este ejercicio, cumple con lo que se pedía. En el código se usan algunas cosas que creo que no se han trabajado durante el curso como http-equiv, viewport o el uso de let en JavaScript.
En https://aprenderaprogramar.com/foros/index.php?topic=3289.0 puede verse una solución donde en lugar de mostrarse el contenido de cada párrafo y pedir que se pulse aceptar, se crea una cadena con el contenido de todos los párrafos y se muestra de una sola vez, que es más cómodo.

Salu2

 

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".