Buenos días aquí dejo una posible solución al ejercicio CU01140E del manual de programación JavaScript....
EJERCICIO
Crea una página web donde inicialmente exista un div con borde solid y ancho delimitado con el texto “Curso JavaScript aprenderaprogramar.com”. Debajo del div deben mostrarse dos botones o pulsadores. Un botón debe indicar “Añadir al final” y otro “Anidar”. Cuando se pulse el botón “Añadir al final”, debe añadirse un div al final de la página con el texto “Nodo creado 1” (o Nodo creado 2, 3, 4… según corresponda). Cuando se pulse el botón “Anidar” debe añadirse un div dentro del div inicial con el texto “Nodo creado 5” (o Nodo creado 6, 7, 8… según corresponda). La numeración será única, es decir, podremos saber en qué orden han sido creados los div estén dentro o fuera del div inicial.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Curso JavaScript de aprenderaprogramar.com</title>
<style type="text/css" media="screen">
body {
font-family: sans-serif;
text-align: center;
}
div {
border-style: solid;
margin: 30px;
padding: 15px;
display: inline-block;
}
</style>
<script type="text/javascript">
var contador = 1;
function agregarNuevo(sitio){
var nodoHijo = document.createElement('div');
var nodoText = document.createTextNode('Nodo Creado '+contador);
var nodoPadre = document.getElementsByTagName(sitio);
nodoPadre[0].appendChild(nodoHijo);
nodoHijo.appendChild(nodoText);
contador++;
}
</script>
</head>
<body>
<div>
<p>Curso JavaScript aprenderaprogramar.com</p>
</div><br/>
<input type="button" value="Añadir al final" onclick="agregarNuevo('html')"/>
<input type="button" value="Anidar" onclick="agregarNuevo('div')"/><br/>
</body>
</html>
Saludos.....
Tema: JavaScript createElement createTextNode appendChild crear anidamientos CU01140E (Leído 2104 veces)
RSS -
WAP2