No puedo crear elemento

Biasoli · #1 (**permalink**) 12/01/2009, 22:15

Hola.
Lo que yo quiero hacer es acceder a una lista usando DOM y crear un ítem. Pero cuando lo pruebo no anda. No se que puede ser.
El código es este:

Código:

<html>
<head>
<script type="text/javascript">
function crear(){
var principal = document.getElementById("div1");
var nuevo = document.createElement("li");
nuevo.innerHTML = "<a href=\"http://www.google.com.ar\">Google</a>";
principal.childNodes[1].firstChild.appendChild(nuevo);
}
</script>
</head>

<body>
<input type="button" value="Crear" onclick="crear()" />
	<div style="width: 500px" id="div1">
	  <h5>Título</h5>
	  <div>
		<ul>
		 <li>Ítem 1</li>
		 <li>Ítem 2</li>
		</ul>
	  </div>
	</div>
</body>
</html>

La línea 8 es la que da problemas creo.
El código HTML tiene que ser estrictamente así, no lo puedo cambiar.
Espero que puedan ayudarme gracias.

caricatos · #2 (**permalink**) 13/01/2009, 00:06

Hola:

Si te fijas en la estructura que nos muestras, el childNodes[1] que especificas es el tag h5, ya que hay un salto de línea intermedio que se considera un nodo de texto, y su firstChild también es un nodo de texto que no admite el appendChild...

En este caso concreto sería mejos ponerle id a la lista "ul", o dirctamente usar getElementsByTagName("ul")[0].

Saludos

Biasoli · #3 (**permalink**) 13/01/2009, 11:11

Gracias por responder.
Yo pensaba que el childNodes[1] era el segundo div, y childNodes[0] era el h5. No sabía que se contaban como nodos los textos.
Me encantaría ponerle un id a la lista, pero este código simula al que realmente quiero añadirle un ítem. Por eso prefiero que sea lo más parecido posible al original.
Lo que no me quedo en claro es: ¿los nodos de texto del h5 y el segundo div son nodos child del primer div?