Aqui dejo la entrega del ejercicio CU01138E del curso de programación web con JavaScript. Me cuesta bastante crear la logica para resolver problemas, me complico yo solo... luego tengo que dar vueltas al codigo para intentar limpiar y dejarlo legible... poco a poco y practicando ire asimilando conceptos. Saludos.
<!doctype html>
<html lang="es">
<head>
<meta charset="UTF-8">
<title>Ejercicio Tema 38 - innerHTML...(CU01138E)</title>
<style>
body{
font-family: Arial;
text-align: center;
}
#principal {
width: 200px;
height: 200px;
margin: 50px auto;
border: 1px solid black;
position: relative;
box-sizing: content-box;
}
#principal>div{
width: 100px;
height: 100px;
border: 1px solid black;
line-height: 100px;
float: left;
box-sizing: border-box;
}
button{
display: block;
margin: 20px auto;
}
</style>
<script>
var contador = 1;
var divs = document.getElementsByTagName('div');
var avanzar = function () {
switch (contador) {
case 1:
divs[1].style.color = 'white';
divs[1].style.backgroundColor = 'black';
divs[1].innerHTML = 'El';
contador++;
break;
case 2:
divs[2].innerHTML = 'Poder';
contador++;
break;
case 3:
divs[3].innerHTML = 'de';
contador++;
break;
case 4:
divs[4].style.backgroundColor = 'yellow';
divs[4].innerHTML = 'JavaScript';
contador++;
break;
case 5:
var msg = document.createElement('div');
msg.style.fontSize = '.8em';
msg.innerHTML = '<h2>LO SIENTO, PERO NO ES POSIBLE AVANZAR MAS</h2>';
document.body.appendChild(msg);
contador++;
break;
default:
}
}
</script>
</head>
<body>
<div id="principal">
<div>?</div>
<div>?</div>
<div>?</div>
<div>?</div>
</div>
<button onclick="avanzar()">Avanzar</button>
</body>
</html>
Tema: JavaScript diferencia entre ámbito global y local ejemplo innerHTML CU01138E (Leído 2092 veces)
RSS -
WAP2