tutoriais mais recente desenvolvimento web
 

Mesa insertRow() Method

<Tabela objecto

Exemplo

Inserir nova row(s) na primeira posição de uma tabela (e inserir um <td> elemento com algum conteúdo a ele):

// Find a <table> element with id="myTable":
var table = document.getElementById("myTable");

// Create an empty <tr> element and add it to the 1st position of the table:
var row = table.insertRow(0);

// Insert new cells (<td> elements) at the 1st and 2nd position of the "new" <tr> element:
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);

// Add some text to the new cells:
cell1.innerHTML = "NEW CELL1";
cell2.innerHTML = "NEW CELL2";
Tente você mesmo "

Definição e Uso

O insertRow() método cria um vazio <tr> elemento e adiciona-lo para uma mesa.

O insertRow() método insere a nova row(s) no índice especificado na tabela.

Nota: A <tr> elemento deve conter um ou mais <th> ou <td> elementos.

Dica: Use o deleteRow() método para remover uma linha.


Suporte navegador

Método
insertRow() sim sim sim sim sim

Sintaxe

tableObject .insertRow( Os valores dos parâmetros
Valor Descrição
index Requerida no Firefox e Opera, opcional em IE, Chrome e Safari. Um número que indica a posição da linha para inserir (começa em 0). O valor de 0 resulta em que a nova linha irá ser inserido na primeira posição.

O valor de -1 também pode ser utilizado, isso resulta em uma nova linha a ser inserida na última posição.

Este parâmetro é necessário no Firefox e Opera, mas opcional no Internet Explorer, Chrome e Safari.

Se este parâmetro for omitido, insertRow() insere uma nova linha na última posição no Chrome, IE, Firefox e Opera, e na primeira posição no Safari.

Detalhes técnicos

Valor de retorno: O inserido <tr> elemento

mais Exemplos

Exemplo

Criar e apagar row(s) :

function myCreateFunction() {
    var table = document.getElementById("myTable");
    var row = table.insertRow(0);
    var cell1 = row.insertCell(0);
    var cell2 = row.insertCell(1);
    cell1.innerHTML = "NEW CELL1";
    cell2.innerHTML = "NEW CELL2";
}

function myDeleteFunction() {
    document.getElementById("myTable").deleteRow(0);
}
Tente você mesmo "

Páginas relacionadas

: Referência HTML HTML <tr> tag


<Tabela objecto