Heim  >  Artikel  >  Web-Frontend  >  Javascript Tabellenzeile löschen

Javascript Tabellenzeile löschen

PHPz
PHPzOriginal
2023-05-21 10:01:371810Durchsuche

In JavaScript können wir durch DOM-Manipulation ganz einfach eine Zeile in einer Tabelle löschen. Im Folgenden werden zwei grundlegende Möglichkeiten zum Löschen einer Zeile in der Tabelle vorgestellt.

  1. Das Löschen erfolgt über die Methode deleteRow() des Tabellenobjekts

In HTML können Sie der Zeilennummer eine ID zuweisen gelöscht werden Oder löschen Sie, indem Sie die Position der zu löschenden Zeile angeben. Der Code lautet wie folgt:

Codebeschreibung:

  • Die Methode deleteRow() in dieser Methode wird verwendet, um die Zeile an der angegebenen Position (gezählt ab) zu löschen 0).
  • In diesem Beispiel befindet sich die erste Zeile an Position 0, die zweite Zeile an Position 1 und so weiter.
  • Wenn die zu löschende Zeile nicht in der Tabelle enthalten ist, wird ein Fehler ausgegeben.
  • Sie müssen eine der Tabelle entsprechende Variable einführen. Der Wert der Variablen kann mit getElementById() oder anderen Methoden ermittelt werden.
  1. Das Löschen erfolgt über das parentNode-Attribut des HTMLElement-Objekts

Zusätzlich zur oben genannten Methode können wir auch verwenden das parentNode-Attribut zum Löschen von Elementen. In HTML können wir eine Zeile löschen, indem wir das übergeordnete Element des aktuell ausgewählten Zeilenelements abrufen, also das tbody-Element der Tabelle. Der Code lautet wie folgt:

Codebeschreibung:

  • Rufen Sie zuerst das zu löschende Zeilenelement ab. Sie können dazu die Methode getElementById() oder andere Methoden verwenden bekomme es.
  • Dann verwenden Sie die parentNode-Eigenschaft des Zeilenelementobjekts, um das Tabellentabellenobjekt abzurufen, und rufen Sie das tbody-Element von diesem Objekt ab.
  • Verwenden Sie abschließend die Methode „removeChild()“ des tbody-Objekts, um die ausgewählten Zeilenelemente zu entfernen.

Zusammenfassung

Das Löschen einer Zeile in einer Tabelle ist einfach, entweder mit der Methode deleteRow() oder mit dem Attribut parentNode. Viele Entwickler bevorzugen die Methode deleteRow() aufgrund ihrer Einfachheit und Klarheit. Andererseits ist die Verwendung des parentNode-Attributs ein allgemeinerer Ansatz, der für jedes Element in einem HTML-Dokument verwendet werden kann. Für Entwickler, die wiederverwendbare Funktionalität implementieren möchten, ist die Verwendung des parentNode-Attributs zweifellos besser geeignet.

Das obige ist der detaillierte Inhalt vonJavascript Tabellenzeile löschen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn