Hola a todos:
Creo que ahora tiene mucha importancia trabajar con el modelo de objetos en javascript, y preparé un par de funciones para insertar/borrar elementos (en las FAQs hay un tema para añadir al final, y ahora implementé algo para hacerlo por delante, aunque faltaría un chequeo que luego explicaré...
Y otra rutina borra elementos (insertBefore y removeChild):
Código:
<html>
<head>
<script type="text/javascript">
function borrarCapa(capa) {
capa.parentNode.removeChild(capa);
}
function crearCapa(id_contenedor, tipo_tag, atributos, estilos, contenido) {
var los_estilos = estilos.split(",");
var los_atributos = atributos.split(",");
var yo = document.createElement(tipo_tag);
yo.id = "ID_" + Date();
for (var i = 0; i < los_atributos.length; i ++)
yo.setAttribute(los_atributos[i].split("=")[0], los_atributos[i].split("=")[1]);
for (var i = 0; i < los_estilos.length; i ++)
yo.style[los_estilos[i].split("=")[0]] = los_estilos[i].split("=")[1];
yo.appendChild(document.createTextNode(contenido));
siguiente = document.getElementById(id_contenedor).firstChild;
document.getElementById(id_contenedor).insertBefore(yo, siguiente);
return yo.id;
}
function ini() {
var capa1 = crearCapa("cuerpo", "div", "align=center,name=pepe", "color=blue,cursor=pointer", "hola");
with(document.getElementById(capa1).style) {
display = "block";
// position = "absolute";
// top = "0px";
// left = "0px";
// width = document.body.clientWidth + "px";
// height = document.body.clientHeight + "px";
backgroundImage = "url(../miemoticon.gif)";
backgroundRepeat = "no-repeat";
backgroundPosition = "center center";
}
document.getElementById(capa1).onclick=function(){borrarCapa(this)};
}
</script>
</head>
<body id="cuerpo" onload="ini()" >
<div id="interior" >
<br />
<br />
<br />
<br />
</div>
</body>
</html>
Lo que quedaría por implementar es el control de nodos hijos...
if (hasChildNodes) insertBefor()... else appendChild()...
Bueno... si les parece que veamos el manejo del DOM, creo que podría ser interesante.
Saludos
