HTML + JavaScript Recorrer una Tabla
8:43 |
Publicado por
Eduardo A. F. |
Editar entrada
<table>
Para recorrer los nodos de una tabla hasta llegar al contenido almacenado en una celda utilizando Javascript hay que recurrir al uso de los metodos:
- elemento.childNodes
- elemento.childNodes[i]
- elemento.childNodes[i].firstChild
- elemento.childNodes.firstChild
EJEMPLO 1:
<table id="tblLista">
<thead>
<tr>
<th>F.</th><th>CONCEPTO</th><th>CANTIDAD</th><th></th><th></th>
</tr>
</thead>
<tbody>
<tr>
<td>
<label>2</label>
</td>
<td>
<label>flecha</label>
</td>
<td>
<label>5.00</label>
</td>
<td>
<input type="button" id="botRegM0" name="botRegM0" value="Modificar" />
</td>
<td>
<input type="button" id="botRegE0" name="botRegE0" value="Eliminar" />
</td>
</tr>
<tr>
<td>
<label>5</label>
</td>
<td>
<label>tomates</label>
</td>
<td>
<label>7.20</label>
</td>
<td>
<input type="button" id="botRegM1" name="botRegM1" value="Modificar" />
</td>
<td>
<input type="button" id="botRegE1" name="botRegE1" value="Eliminar" />
</td>
</tr>
</tbody>
</table>
EJEMPLO 2:
<table id="tblLista">
<thead>
<tr>
<th>F.</th><th>CONCEPTO</th><th>CANTIDAD</th><th></th><th></th>
</tr>
</thead>
<tbody><tr>
<td><label>2</label></td>
<td><label>flecha</label></td>
<td><label>5.00</label></td>
<td><input type="button" id="botRegM0" name="botRegM0" value="Modificar" /></td>
<td><input type="button" id="botRegE0" name="botRegE0" value="Eliminar" /></td>
</tr><tr>
<td><label>5</label> </td>
<td><label>tomates</label></td>
<td><label>7.20</label></td>
<td><input type="button" id="botRegM1" name="botRegM1" value="Modificar" />
</td><td><input type="button" id="botRegE1" name="botRegE1" value="Eliminar" />
</td></tr>
</tbody>
</table>
Aunque las dos tengan el mismo contenido y visualmente sean identicas, el recorrido debe de ser distinto ya que en el primer ejemplo las indentaciones y los saltos de linea los detecta como nodos de texto vacios.
En el segundo ejemplo no hay saltos de linea entre tr's ni tampoco de un td a su label asi, los nodos de texto desaparecen y si antes para llegar al texto que habia en un label habria que hacerlo con una i=4 por ejemplo aqui seria con i=1.
Esto me sucedio porque PHP me generaba una tabla con una identacion en las tr y td que no se como la calcula dando como resultado el ejemplo 2 y claro, el algoritmo que habia creado funcionaba perfectamente para el ejemplo 1 cuya tabla la tome como modelo y la hice manualmente.
Lo que no entiendo y si alguien lo podria comentar seria estupendo, es porque en XML se puede identar y hacer saltos de linea sin que estos sean tomados como nodos de texto.
Suscribirse a:
Enviar comentarios (Atom)
2 comentarios:
wza
Y bueno donde mierda está el ejemplo en javascript capo?
Publicar un comentario