Hola:
Recuerdo que en estos foros, alguien hizo una comparativa para ver que era más rápido, y justamente llegó a la conclusión contraria, pero no creo que haya suficiente margen como para decidirse por el uso de una u otra opción... y sobre que estará obsoleto tampoco lo sabía... lo que es seguro es que no es estándar... pero su uso es tan masivo que se ha convertido en estándar "de facto" (creo que se dice así
)...
Sobre lo de mejorar tu código con DOM no tengo la menor duda, ya que hay algunas cosas más que no todos usan... como cloneNode y replaceChild...
Código:
<html>
<head>
<title>
Clonación
</title>
<script type="text/javascript">
function sube(que) {
var nuevo = que.cloneNode(true);
que.parentNode.appendChild(nuevo);
que.parentNode.removeChild(que);
}
</script>
</head>
<body >
<div id="contenedor" style="position: relative; height: 200px">
<div id="amarillo" style="width: 120px; height: 120px; background-color: yellow; position: absolute; top: 5px; left: 5px; border: 1px solid black" onclick="sube(this)"></div>
<div id="rojo" style="width: 120px; height: 120px; background-color: red; position: absolute; top: 35px; left: 35px; border: 1px solid black" onclick="sube(this)"></div>
<div id="azul" style="width: 120px; height: 120px; background-color: blue; position: absolute; top: 65px; left: 65px; border: 1px solid black" onclick="sube(this)"></div>
</div>
</body>
</html>
Creo que este código lo mostré hace algunos años, solo hace falta que lo adaptes.
Saludos
