Ejercicios resueltosRespuestas al ejercicio CU01152E del manual de programación aprender programación web como si estuviera en primero.
¿Qué significa el operador += que se emplea en el código?
+= operador de asignación de suma seria como si fuese a = a + b;
b) ¿Por qué usamos [ 0 ] para establecer nodoBody?
nodoBody[0] par traer el primer elmento del posicion cero de array
¿Qué ocurre si dejamos en blanco la respuesta cuando se pide un color? Razona por qué ocurre esto.
No le asigna ningún color y ejecuta '<h1>No eligió color</h1>' e imprimie No eligió color ya que es un condicional ternario
¿Qué ocurre si escribimos pink cuando nos pide el color? Razona por qué ocurre esto.
Le asigna el color pink ya no hay una condicion que no permita insertar otro color que no sea red,yellow o blue
e) Modifica el código para que usando el operador ternario, si el usuario no introduce como color red, yellow o blue aparezca el mensaje ‘No eligió color o el color es no válido’
<!DOCTYPE html>
<html>
<head>
<title>Ejemplo aprenderaprogramar.com</title>
<meta charset="utf-8">
<script type="text/javascript">
function ejemplo() {
var htmlADevolver = '';
var colorUsuario = prompt('Elija color red, yellow o blue');
htmlADevolver = colorUsuario.toLowerCase()=='red' || colorUsuario.toLowerCase()=='yellow' || colorUsuario.toLowerCase()=='blue' ? '<h1 style="background-color:'+
colorUsuario+';"> Usted eligió '+colorUsuario.toLowerCase()+'</h1>' : '<h1>No eligió color o el color no es válido</h1>';
var nodoBody = document.getElementsByTagName('body')[0];
nodoBody.innerHTML = nodoBody.innerHTML + htmlADevolver;
}
</script>
</head>
<body>
<div id="cabecera"><h2>Cursos aprenderaprogramar.com</h2><h3>Ejemplos JavaScript</h3></div>
<div style="color:blue;" id ="pulsador" onclick="ejemplo()"> Probar </div>
</body>
</html>
f) Reescribe el código inicial de partida sustituyendo el condicional ternario por if tradicionales.
<!DOCTYPE html>
<html>
<head>
<title>Ejemplo aprenderaprogramar.com</title>
<meta charset="utf-8">
<script type="text/javascript">
function ejemplo() {
var htmlADevolver = '';
var colorUsuario = prompt('Elija color red, yellow o blue');
if (colorUsuario.toLowerCase()=='red' || colorUsuario.toLowerCase()=='yellow' || colorUsuario.toLowerCase()=='blue'){
htmlADevolver = '<h1 style="background-color:'+
colorUsuario+';"> Usted eligió '+colorUsuario.toLowerCase()+'</h1>'
}else{
htmlADevolver = '<h1>No eligió color o el color no es válido</h1>';
}
var nodoBody = document.getElementsByTagName('body')[0];
nodoBody.innerHTML = nodoBody.innerHTML + htmlADevolver;
}
</script>
</head>
<body>
<div id="cabecera"><h2>Cursos aprenderaprogramar.com</h2><h3>Ejemplos JavaScript</h3></div>
<div style="color:blue;" id ="pulsador" onclick="ejemplo()"> Probar </div>
</body>
</html>