logo

insertRow()

logo

Olá, estamos aqui mais uma vez.

Esta é uma página permanente para a descrição do método insertrow do DOM.

Para que serve?

Este método é usado para inserir uma nova linha em uma tabela (tr).
Ele também adiciona a nova linha na coleção de linhas (rows collection)

Sintaxe

var oRow = HTMLTableElement.insertRow(index);
  • HTMLTableElement é a referencia do elemento tabela do seu HTML
  • index é o índice aonde a nova linha vai ser inserida (o padrão é -1 que será a ultima linha)
  • oRow é a referencia a nova linha criada

Exemplo

<table id="minhaTabela">
  <tr>
    <td>Linha fixa</td>
  </tr>
</table>

<script type="text/javascript">

  function adicionarLinhaEmTabela(idDaTabela)
  {

    // Pega a referencia da tabela
    var oTable = document.getElementById(idDaTabela);

    // Insere a nova linha [(-1) para ser a última linha]
    var oNovaLinha_Tr   = oTable.insertRow(-1);

    // Insere uma celula na nova linha [(0) é o índice]
    // Em breve um novo tutorial sobre o insertCell
    var oNovaCelula_Td  = oNovaLinha_Tr.insertCell(0);

    // Adicionamos um texto para a nova célula
    var NovoTexto  = document.createTextNode('Nova Linha')
    oNovaCelula_Td.appendChild(NovoTexto);
  }

// Chamada da função adicionarLinhaEmTabela() com o id da tabela
adicionarLinhaEmTabela('minhaTabela');

</script>

Veja um outro exemplo mais completo aqui

MSDN
Mozila
w3schools

Bookmark and Share

Alguém marcou to “insertRow()”

  1. [...] Aprenda a usar o método inserRow() [...]

logo
logo
Hospedado no Djalma | Ruan Carlos.