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: bermartinv en 23 de Marzo 2016, 10:18
-
Hola chicos, pongo mis soluciones a este tema, CU01180E del tutorial JavaScript desde cero.
Examina el siguiente código y responde a las cuestiones que se muestran a continuación:
var arr = [];
var divs = document.querySelectorAll('div');
for(var i = divs.length; i--; arr.unshift(divs[i]));
a) ¿Qué cometido cumple este código?
El cometido que tiene es pasar los elemento de un array-like a un array.
b) Aplicando la idea que podemos extraer de este código, modifica el código que hemos visto como ejemplo en esta entrega para crear un array con los elementos input y select del formulario y mostrar por pantalla el número de elementos input y select existentes en el formulario.
<!DOCTYPE html>
<html><head><title>Ejemplo aprenderaprogramar.com</title><meta charset="utf-8">
<style type="text/css"> body {margin-left:30px; font-family: sans-serif;}
.estiloForm {background-color: #f3f3f3; border: solid 2px black; margin-left:20px; width: 330px; padding:10px; }
.estiloForm label {display: block; width: 120px; float: left; text-align:right; margin-bottom: 35px; padding-right: 20px;}
br {clear: left;} input[type="submit"], input[type="reset"] {margin:25px 5px 10px 5px;}
</style>
<script type="text/javascript">
window.onload = function () {
var elementosInput = document.getElementsByTagName('input'); //Elementos input
var elementosSelect = document.getElementsByTagName('select');
var arrInput = [];
var arrSelect = [];
for(var i = elementosInput.length; i--; arrInput.unshift(elementosInput[i]));
for(var i= elementosSelect.length; i--; arrSelect.unshift(elementosSelect[i]));
alert ("Tenemos "+arrInput.length+" elementos de tipo input y "+arrSelect.length+" elementos de tipo select.");
}
</script></head>
<body><h2>Cursos aprenderaprogramar.com</h2><h3>Ejemplos JavaScript</h3>
<div class="estiloForm"> <form name ="formularioContacto" method="get" action="#">
<label>Tratamiento</label>
<input type="radio" name="tratamiento" id="tratarSr" value="Sr."/>Sr.
<input type="radio" name="tratamiento" id ="tratarSra" value="Sra."/>Sra.<br/>
<label>Nombre</label><input id="nombre" name="nombre" type="text"/><br/>
<label>Apellidos</label><input id="apellidos" name="apellidos" type="text"/><br/>
<label>Dirección</label><input id="direccion1" name="direccion1" type="text"/><br/>
<label>Ciudad</label><select id="ciudad" name="ciudad">
<option value="">Elija opción</option>
<option value="Mexico">México D.F. (MX)</option>
<option value="Madrid">Madrid (ES)</option>
<option value="Santiago">Santiago (CL)</option>
</select><br/>
<label>Preferencias</label><input name="Libros" type="checkbox" />Libros
<input name="Peliculas" type="checkbox" />Películas
<input type="submit" value="Enviar"/> <input type="reset" value="Cancelar"/>
</form></div>
</body></html>
Saludos.
-
Buenas.
Veo todo bien.
Si no lo viste ya, sería aconsejable leer los comentarios que hay en el siguiente enlace, acerca de este ejercicio.
https://www.aprenderaprogramar.com/foros/index.php?topic=3827.msg16377#msg16377
Saludos bermartinv.
-
Gracias pedro,, por mandarme el enlace. No lo había leido y me ha gusto mucho, no pensaba que se pudiera hacer tantas cosas con for.
Saludos ;)