Beispiel
Legen Sie eine neue row(s) in der ersten Position einer Tabelle (und fügen Sie ein <td> Element mit Inhalt zu ihm):
// 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"; Versuch es selber " Definition und Verwendung
Die insertRow() Methode erstellt ein leeres <tr> Element und fügt sie zu einem Tisch.
Die insertRow() Methode fügt die neue row(s) am angegebenen Index in der Tabelle.
Hinweis: Ein <tr> Element eines oder mehrere enthält <th> oder <td> Elemente.
Tipp: Verwenden Sie die deleteRow() Methode , eine Zeile zu entfernen.
Browser-Unterstützung
| Methode | |||||
|---|---|---|---|---|---|
| insertRow() | Ja | Ja | Ja | Ja | Ja |
Syntax
tableObject .insertRow( Parameterwerte Wert Beschreibung index Erforderlich in Firefox und Opera, optional in IE, Chrome und Safari. Eine Zahl, die die Position der Zeile angibt einzufügen (beginnt bei 0). Der Wert von 0 führt, dass die neue Zeile wird in der ersten Position eingeführt werden kann. Der Wert von -1 kann auch verwendet werden, führt dies zu einer neuen Zeile an der letzten Position eingefügt wird.
Dieser Parameter ist erforderlich in Firefox und Opera, aber optional in Internet Explorer, Chrome und Safari.
Wenn dieser Parameter weggelassen wird, insertRow() fügt eine neue Zeile an der letzten Position in Chrome, IE, Firefox und Opera und an der ersten Position in Safari.
Technische Details
Rückgabewert: Das eingegebene <tr> Element
Mehr Beispiele
Beispiel
Erstellen und Löschen von 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);
} Versuch es selber "
Verwandte Seiten
HTML - Referenz: HTML <tr> -Tag
<Table Object