Table insertRow() -menetelmä

HTML DOM Table-objekti

Määritelmä ja käyttö

insertRow() menetelmä luo tyhjän <tr>-elementti ja lisää se taulukkoon.

insertRow() Menetelmä lisää uuden rivin taulukon määrittämään indeksiin.

Huomaa:<tr>-elementti täytyy sisältää <th> tai <td>-elementti.

Vinkki:Käytä deleteRow() -menetelmä Poista rivi.

Katso myös:

HTML-viittausoppikirja:HTML <tr>-tagi

Esimerkki

Esimerkki 1

Lisää uusi rivi taulukkoon ensimmäiseen sijaintiin (ja lisää sisällöllinen <td>-elementti):

// Etsi id="myTable" -sisältävä <table>-elementti:
var table = document.getElementById("myTable");
// Luo tyhjä <tr>-elementti ja lisää se ensimmäiseen sijaintiin taulukkoon:
var row = table.insertRow(0);
// Lisää uudet solut (td-elementit) "uuden" <tr>-elementin ensimmäiseen ja toiseen sijaintiin:
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
// Lisää teksti uusiin soluihin:
cell1.innerHTML = "NEW CELL1";
cell2.innerHTML = "NEW CELL2";

Kokeile itse

Esimerkki 2

Rivien luominen ja poistaminen:

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);
}

Kokeile itse

syntaksi

tableObject.insertRow(index)
parametri kuvaus
index

Välttämätön Firefoxissa ja Operassa, valinnainen IE:ssä, Chrome:ssa ja Safarissa.

Luku, joka määrittää lisättävän rivin sijainnin (alkaen 0). Arvo 0 tarkoittaa, että uusi rivi lisätään ensimmäiseen sijaintiin.

Voi käyttää myös -1 arvoa, mikä johtaa uuden rivin lisäämiseen viimeiseen sijaintiin.

Jos parametri jätetään pois, insertRow() lisää uuden rivin viimeiseen sijaintiin Chrome, IE, Firefox ja Opera -selaimissa sekä ensimmäiseen sijaintiin Safari-selaimessa.

Tekninen yksityiskohta

Palautusarvo: Lisätty <tr>-elementti.

Selaimen tuki

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Tuki Tuki Tuki Tuki Tuki

HTML DOM Table-objekti