Μέθοδος insertCell() της TableRow

HTML DOM TableRow Οντόντα

Ορισμός και χρήση

insertCell() Η μέθοδος αυτή εισάγει το κελί στη τρέχουσα γραμμή.

Συμβουλή:Χρησιμοποιήστε Μέθοδος deleteCell() Διαγράψτε το κελί από την τρέχουσα γραμμή του πίνακα.

Για περισσότερες πληροφορίες δείτε:

Εγχειρίδιο αναφοράς HTML:HTML <tr> Σημείωση

Παραδείγματα

Παράδειγμα 1

Εισάγετε νέα κελί με περιεχόμενο στην αρχή της γραμμής του πίνακα με id="myRow":

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

Δοκιμάστε το Εκτέλεση

Παρέχονται περισσότερες παραδείγματα στο κάτω μέρος της σελίδας.

γλώσσα

tablerowObject.insertCell()index)
Παράμετροι Περιγραφή
index

Είναι απαραίτητη στα Firefox και Opera, και προαιρετική στα IE, Chrome και Safari.

Αριθμητική τιμή (από 0), η οποία καθορίζει τη θέση του νέου κελιού στη τρέχουσα γραμμή.

Η τιμή 0 θα προκαλέσει την εισαγωγή του νέου κελιού στην πρώτη θέση. Μπορεί επίσης να χρησιμοποιηθεί η τιμή -1, η οποία θα προκαλέσει την εισαγωγή του νέου κελιού στην τελευταία θέση.

Αν παραλειφθεί αυτός ο παράμετρος, η insertCell() θα εισάγει το νέο κελί στην τελευταία θέση στο IE, και στην πρώτη θέση στο Chrome και Safari.

Τεχνικά λεπτομέρειες

Αποτελεσματική τιμή:

Το στοιχείο του κελιού που εισάγεται.

Υποστήριξη του προγράμματος περιήγησης

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Υποστήριξη Υποστήριξη Υποστήριξη Υποστήριξη Υποστήριξη

Περισσότερες περιπτώσεις

Παράδειγμα 2

Εισάγουμε νέο κελί με περιεχόμενο στην τελευταία θέση της γραμμής του πίνακα με id="myRow":

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

Δοκιμάστε το Εκτέλεση

Παράδειγμα 3

Εισάγουμε νέο κελί με περιεχόμενο στην θέση 2 της γραμμής του πίνακα με id="myRow":

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

Δοκιμάστε το Εκτέλεση

Παράδειγμα 4

Εισάγουμε νέο κελί στην αρχή της πρώτης γραμμής του πίνακα. Η συλλογή rows (.rows[0]) επιστρέφει τη συλλογή όλων των στοιχείων <tr> του πίνακα με id="myTable".

Ο αριθμός [0] καθορίζει το στοιχείο που θα αναζητηθεί, εδώ είναι η πρώτη γραμμή του πίνακα. Στη συνέχεια χρησιμοποιούμε την insertcell() για να εισάγουμε νέο κελί στην θέση -1:

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

Δοκιμάστε το Εκτέλεση

Παράδειγμα 5

Αφαιρούμε το πρώτο κελί από τη γραμμή του πίνακα με id="myRow":

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

Δοκιμάστε το Εκτέλεση

Παράδειγμα 6

Εισάγουμε νέα γραμμή στην αρχή του πίνακα.

Η μέθοδος insertRow() εισάγει νέα γραμμή στην καθορισμένη θέση του πίνακα, εδώ στην αρχή του πίνακα με id="myTable".

αρκετά πριν, χρησιμοποιούμε τη μέθοδο insertCell() για να προσθέσουμε κελί σε νέα γραμμή.

var table = document.getElementById("myTable");
var row = table.insertRow(0);
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
cell1.innerHTML = "ΝΕΟ ΚΕΛΛΙ1";
cell2.innerHTML = "ΝΕΟ ΚΕΛΛΙ2";

Δοκιμάστε το Εκτέλεση

HTML DOM TableRow Οντόντα