Buenas. Mis respuestas:
a) ¿Escribir if (elementosObtenidos[1].checked == true) genera el mismo resultado que escribir if (elementosObtenidos[1].checked)? ¿Por qué?
Sí, genera el mismo resultado porque JS trata de obtener el valor booleano aunque nosotros no lo especifiquemos.
b) Modifica el código para obtener el mismo resultado pero sin utilizar if anidados.
c) Utilizando la propiedad length aplicada a la colección de nodos obtenida mediante getElementsByName, modifica el código para que el resultado sea que al enviar el formulario el mensaje que aparezca sea “El número total de animales disponibles era … y usted ha elegido …”.
Para las preguntas b y c los dejo en un mismo código.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Ejemplo JavaScript - aprenderaprogramar.com</title>
<meta charset="utf-8">
<style type="text/css">
body {background-color:white; font-family: sans-serif;}
label {color: maroon; display:inline-block; padding:5px;}
</style>
<script type="text/javascript">
function informarItemsElegidos(nombre1) {
var elementosObtenidos = document.getElementsByName(nombre1);
var msg = 'Animales que ha elegido que le gustan incluye: ';
var elegidos = 0;
if (elementosObtenidos[0].checked == true) {
msg = msg + elementosObtenidos[0].value;
elegidos=elegidos+1;
}
if (elementosObtenidos[1].checked == true && elegidos >= 1) {
msg = msg + ', ';
msg = msg + elementosObtenidos[1].value;
elegidos=elegidos+1;
} else if (elementosObtenidos[1].checked == true) {
msg = msg + elementosObtenidos[1].value;
elegidos=elegidos+1;
}
if (elementosObtenidos[2].checked == true && elegidos >= 1) {
msg = msg + ', ';
msg = msg + elementosObtenidos[2].value;
elegidos=elegidos+1;
} else if (elementosObtenidos[2].checked == true) {
msg = msg + elementosObtenidos[2].value;
elegidos=elegidos+1;
}
if (elementosObtenidos[3].checked == true && elegidos >= 1) {
msg = msg + ', ';
msg = msg + elementosObtenidos[3].value;
elegidos=elegidos+1;
} else if (elementosObtenidos[3].checked == true) {
msg = msg + elementosObtenidos[3].value;
elegidos=elegidos+1;
}
if (elegidos == 0 ) {
msg = '¡No ha elegido ningún animal!';
}
alert (msg);
alert ('El numero de animales disponibles era: ' + elementosObtenidos.length + '\n Y usted ha seleccionado: ' + elegidos);
}
</script>
</head>
<body>
<div id="cabecera">
<h1>Portal web aprenderaprogramar.com</h1>
<h2>Didáctica y divulgación de la programación</h2>
</div>
<!-- Formulario de contacto -->
<div style="width:450px;">
<form name ="formularioContacto" class="formularioTipo1" method="get" action="" onsubmit="informarItemsElegidos('animal')">
<p>Si quieres contactar con nosotros envíanos este formulario relleno:</p>
<label for="nombre"><span>Nombre:</span> <input id="nombre" type="text" name="nombre" /></label>
<label for="apellidos"><span>Apellidos:</span> <input id="apellidos" type="text" name="apellidos" /></label>
<p>Elige los animales que te gusten:</p>
<input type="checkbox" name="animal" id="leon" value="leon" />
<label for="leon">León </label>
<input type="checkbox" name="animal" id="tigre" value="tigre" />
<label for="tigre">Tigre </label>
<input type="checkbox" name="animal" id="guepardo" value="guepardo" />
<label for="guepardo">Guepardo </label>
<input type="checkbox" name="animal" id="jaguar" value="jaguar" />
<label for="jaguar">Jaguar </label>
<label for="email"><span>Correo electrónico:</span>
<input id="email" type="text" name="email" />
</label>
<label>
<input type="submit" value="Enviar" />
<input type="reset" value="Cancelar" />
</label>
</form>
</div>
</body>
</html>
Muchísimas gracias profesores.