crear <tr> en al medio de una tabla dinamicamente

ratamaster · #1 (**permalink**) 13/05/2008, 09:41

Hola.
Siempre he usado las funciones DOM de js para crear diferentes tipos de elementos, ultimamente uso scriptaculous, pero este no es el caso

Resulta que tengo una tabla, cual está poblada de varios tr con sus IDs,
Yo quiero saber como hacer para crear un tr en le medio de la tabla, o sea, no luego del último tr, sino en el medio.

Gracias

caricatos · #2 (**permalink**) 13/05/2008, 11:15

Hola:

Pues si las filas tienen su id, en vez de usar appendChild para la inserción puedes usar insertBefore...

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>
http://www.caricatos.net/probador
</title>
<script>
// creamos unos alias que ayuden
function tag(id) {return document.getElementById(id);}
function crea(elemento) {return document.createElement(elemento);}
function inserta(sitio, elemento) {sitio.parentNode.insertBefore(elemento, sitio)}
function suma(sitio, elemento) {sitio.appendChild(elemento);}
function texto(x) {return document.createTextNode(x);}
function a(){
x = tag("fila_X");// insertaremos antes de esta fila:
nueva_fila = crea("tr");
nueva_celda = crea("td");
suma(nueva_celda, texto("hola"));
suma(nueva_fila, nueva_celda);
inserta(x, nueva_fila);
}
</script>
</head>
<body>
<table border=1 >
<tr>
<td>prueba 1</td>
</tr>
<tr>
<td>prueba 1</td>
</tr>
<tr id="fila_X">
<td>prueba 1</td>
</tr>
</table>
<button onclick="a()" >insertar</button>
</body>
</html>

Saludos

ratamaster · #3 (**permalink**) 13/05/2008, 11:31

Muchas gracias por tu clara respuesta y tiempo :)