Metoda insertCell() klasy TableRow

Obiekt DOM TableRow HTML

Definicja i użycie

insertCell() Metoda wstawia komórkę do bieżącego wiersza.

Wskazówka:Użyj Metoda deleteCell() Usuń komórkę z bieżącego wiersza tabeli.

Patrz również:

Przeglądarka HTML:Tag HTML <tr>

Przykład

Przykład 1

Wprowadź nową komórkę zawierającą treść na początku wiersza tabeli o identyfikatorze "myRow":

var row = document.getElementById("myRow");
var x = row.insertCell(0);
x.innerHTML = "New cell";

Spróbuj sam

Poniżej znajduje się więcej przykładów.

gramatyka

tablerowObject.insertCell()index)
Parametr Opis
index

Jest wymagana w Firefox i Operze, a w IE, Chrome i Safari jest opcjonalna.

Liczba (zaczynająca się od 0), określająca pozycję nowej komórki w bieżącym wierszu.

Wartość 0 spowoduje wstawienie nowej komórki na pierwszej pozycji. Można również użyć wartości -1, co spowoduje wstawienie nowej komórki na ostatniej pozycji.

Jeśli ten parametr jest pomijany, w IE insertCell() wstawia nową komórkę na ostatniej pozycji, w Chrome i Safari na pierwszej pozycji.

Szczegółowe informacje techniczne

Zwracana wartość:

Element komórki wstawiony.

Wsparcie dla przeglądarek

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Wspierane Wspierane Wspierane Wspierane Wspierane

Więcej przykładów

Przykład 2

Wstaw nową komórkę zawierającą treść na końcu wiersza tabeli o id="myRow":

var row = document.getElementById("myRow");
var x = row.insertCell(-1);
x.innerHTML = "New cell";

Spróbuj sam

Przykład 3

Wstaw nową komórkę zawierającą treść w pozycji 2 wiersza tabeli o id="myRow":

var row = document.getElementById("myRow");
var x = row.insertCell(2);
x.innerHTML = "New cell";

Spróbuj sam

Przykład 4

Wstaw nową komórkę na początku pierwszego wiersza tabeli. Zbiór rows (.rows[0]) zwraca zbiór wszystkich elementów <tr> tabeli o id "myTable".

Numer [0] określa element do wyszukiwania, w tym przykładzie, jest to pierwszy wiersz tabeli. Następnie używamy insertCell() do wstawienia nowej komórki w pozycji -1:

var firstRow = document.getElementById("myTable").rows[0];
var x = firstRow.insertCell(-1);
x.innerHTML = "New cell";

Spróbuj sam

Przykład 5

Usunięcie pierwszej komórki z wiersza tabeli o id="myRow":

var row = document.getElementById("myRow");
row.deleteCell(0);

Spróbuj sam

Przykład 6

Wstaw nowy wiersz na początku tabeli.

Metoda insertRow() wstawia nowy wiersz w określonym miejscu w tabeli, w tym przykładzie, w pierwszym miejscu tabeli z id="myTable" (na początku).

Następnie używamy metody insertCell() do dodania komórki w nowym wierszu.

var table = document.getElementById("myTable");
var row = table.insertRow(0);
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
cell1.innerHTML = "NOWA CELL1";
cell2.innerHTML = "NOWA CELL2";

Spróbuj sam

Obiekt DOM TableRow HTML