Foros aprenderaprogramar.com
Aprender a programar => C, C++, C#, Java, Visual Basic, HTML, PHP, CSS, Javascript, Ajax, Joomla, MySql y más => Mensaje iniciado por: DRANXZ88 en 25 de Marzo 2021, 15:33
-
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
<!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
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
function dividirPalabra(palabra) {
for (var i = 0; i < palabra.length; i++) {
alert("Letra " + (i + 1) + " : " + palabra.charAt(i));
}
}Función del ejercicios 2
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
);
}
}
-
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