HTMLTableElement.insertRow()

El método HTMLTableElement.insertRow() inserta una nueva fila en la tabla.

Sintaxis

var row = HTMLTableElement.insertRow(optional index = -1);
  • HTMLTableElement es una referencia a un elemento table HTML.
  • index es el √≠ndice de fila de la nueva fila.
  • row queda asignada a una referencia a la nueva fila. Una referencia a un HTMLTableRowElement.
    Si index es -1 o igual al n√ļmero de filas, la nueva fila es a√Īadida detr√°s de la √ļltima. Si index es mayor que el n√ļmeros defilas, es lanzada una excepci√≥n IndexSizeError. Si index se omite, se asume por defecto -1.
  • Si  una tabla tiene m√ļltiples elementos tbody, por defecto la nueva fila es insertada en el √ļltimo tbody. Para insertar una fila dentro de un  tbody especifico pued hacer:
    var specific_tbody=document.getElementById(tbody_id);
    var row=specific_tbody.insertRow(index)

Ejemplo

<table id="TableA">
<tr>
<td>Antigua fila superior</td>
</tr>
</table>
<script type="text/javascript">

function addRow(tableID) {
  // Obtiene una referencia a la tabla
  var tableRef = document.getElementById(tableID);

  // Inserta una fila en la tabla, en el índice 0
  var newRow   = tableRef.insertRow(0);

  // Inserta una celda en la fila, en el índice 0
  var newCell  = newRow.insertCell(0);

  // A√Īade un nodo de texto a la celda
  var newText  = document.createTextNode('Nueva fila superior');
  newCell.appendChild(newText);
}

// Llama a addRow() con el ID de la tabla
addRow('TableA');

</script>

Para ser v√°lida en un documento HTML, una TR debe contener al menos un elemento TD.

Observese que insertRow inserta la fila dir√©ctamente en la tabla y retorna una referencia a la nueva fila. La fila no necesita ser a√Īadida separadamente (p.e. con document.appendChild()) tal ser√≠a el caso si se usase document.createElement() para crear el nuevo elemento TR.

Especificaciones

Especificación Estado Observaciones
HTML Living Standard
La definición de 'HTMLTableElement.insertRow()' en esta especificación.
Living Standard  
Document Object Model (DOM) Level 2 HTML Specification
La definición de 'HTMLTableElement.insertRow()' en esta especificación.
Obsolete Especificó con más detalle dónde se inserta la fila.
Document Object Model (DOM) Level 1 Specification
La definición de 'HTMLTableElement.insertRow()' en esta especificación.
Obsolete Definición inicial

Compatibilidad con navegadores

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!
Prestación Chrome Firefox (Gecko) Internet Explorer Opera Safari
Soporte b√°sico 4 3[1] 5.5 10 4
Prestación Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Soporte b√°sico ? ? ? ? ?

[1] A partir deGecko 20.0 (Firefox 20.0 / Thunderbird 20.0 / SeaMonkey 2.17) el argumento index se estableci√≥ como opcional y con valor por defecto -1 seg√ļn la especificaci√≥n HTML.

Ver también