tr insertCell()Methode
tr-Objekt
Definition und Verwendung
Die insertCell()-Methode wird verwendet, um ein leeres <td>-Element an einer angegebenen Position in einer Zeile einer HTML-Tabelle einzufügen.
Syntax
trObject.insertCell(index)
| Wert | Beschreibung |
|---|---|
| index | Diese Methode erstellt ein neues <td>-Element und fügt es an der angegebenen Position in die Zeile ein. Die neue Zelle wird vor der Zelle eingefügt, die sich derzeit an der durch index angegebenen Position befindet. Wenn index der Anzahl der Zellen in der Zeile entspricht, wird die neue Zelle am Ende der Zeile angehängt. |
Browser-Unterstützung
Alle gängigen Browser unterstützen die insertCell()-Methode
Beispiel
Beispiel
Das folgende Beispiel fügt eine Zelle in eine Tabellenzeile ein:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Beispiel-Tutorial (example.com)</title>
<script>
function displayResult(){
var firstRow=document.getElementById("myTable").rows[0];
var x=firstRow.insertCell(-1);
x.innerHTML="New cell"
}
</script>
</head>
<body>
<table id="myTable" border="1">
<tr>
<td>Erste Zelle</td>
<td>Zweite Zelle</td>
<td>Dritte Zelle</td>
</tr>
</table>
<br>
<button type="button" onclick="displayResult()">Zelle einfügen</button>
</body>
</html>
<html>
<head>
<meta charset="utf-8">
<title>Beispiel-Tutorial (example.com)</title>
<script>
function displayResult(){
var firstRow=document.getElementById("myTable").rows[0];
var x=firstRow.insertCell(-1);
x.innerHTML="New cell"
}
</script>
</head>
<body>
<table id="myTable" border="1">
<tr>
<td>Erste Zelle</td>
<td>Zweite Zelle</td>
<td>Dritte Zelle</td>
</tr>
</table>
<br>
<button type="button" onclick="displayResult()">Zelle einfügen</button>
</body>
</html>
Selbst ausprobieren »
Weitere Beispiele
Fügen Sie einer Tabelle eine neue Zeile hinzu – dann fügen Sie Zellen und Inhalt hinzu
tr-Objekt Andere Erweiterungen