14 - Agregar un nodo de tipo elemento en medio (insertBefore - createElement)



Problema:Se debe crear una página que contenga un div con 5 párrafos. Al presionar un botón insertar un nuevo párrafo al principio del div que contiene los 5 párrafos.
<!DOCTYPE html>
<html>
<head>
<title>Problema</title>
<script src="funciones.js"></script>
<link rel="StyleSheet" href="estilos.css" type="text/css">
</head>
<body>
<div id="parrafos">
<p>Este es el primer párrafo</p>
<p>Este es el segundo párrafo</p>
<p>Este es el tercer párrafo</p>
<p>Este es el cuarto párrafo</p>
<p>Este es el quinto párrafo</p>
</div>
<input type="button" value="insertar al principio" onClick="insertarAlPrincipio()">
</body>
</html>
function insertarAlPrincipio()
{
  var elemento=document.createElement('p');
  var nodotexto=document.createTextNode('Ahora este es el primer párrafo');
  elemento.appendChild(nodotexto);
  var pa=document.getElementById('parrafos');
  var puntero=pa.firstChild;
  pa.insertBefore(elemento,puntero); 
}
Ver solución


Retornar