Heim >Web-Frontend >js-Tutorial >JQuery setzen Wert in spezifischer Tabellenzelle
Verwenden von JQuery, um Tabellenzellen zu bedienen: Praktische Funktionen und FAQs
Folgendes ist eine JavaScript -Helferfunktion, die den Preis einer Tabellenzelle basierend auf der Tabellen -ID, Zeilen -ID und Spaltennummer festlegt:
<code class="language-javascript">function setRowPrice(tableId, rowId, colNum, newValue) { $('#' + tableId).find('tr#' + rowId).find('td:eq(' + colNum + ')').html(newValue); }</code>
jQuery Table Cell Operation FAQs (FAQs)
1.
Verwenden Sie JQuery, um den Wert einer bestimmten Tabellenzelle festzulegen. Nach der Auswahl können Sie seinen Wert mit der Methode .html()
oder .text()
festlegen. Zum Beispiel:
<code class="language-javascript">$("table tr:nth-child(2) td:nth-child(3)").html("新值");</code>
Dieser Code legt den Wert der dritten Zelle (tr:nth-child(2)
) der zweiten Zeile der Tabelle (td:nth-child(3)
) auf "neuer Wert" fest.
2.
Erhalten Sie den Wert einer bestimmten Tabellenzelle, Sie können die Methode .text()
oder .html()
verwenden, vorausgesetzt, die Zelle ist ausgewählt. Zum Beispiel:
<code class="language-javascript">var cellValue = $("table tr:nth-child(2) td:nth-child(3)").text();</code>
Dieser Code erhält den Wert der dritten Zelle in der zweiten Zeile der Tabelle.
3.
Alle Zellen in einer spezifischen Spalte können mit dem :nth-child()
-Sähler ausgewählt und dann ihre Werte mit den Methoden .html()
oder .text()
festlegen. Zum Beispiel:
<code class="language-javascript">$("table tr td:nth-child(3)").html("新值");</code>
Dieser Code legt die Werte aller Zellen in der dritten Spalte der Tabelle auf "neuer Wert" fest.
4.
Sie können mit der Methode .addClass()
Klassen zu einer bestimmten Zelle hinzufügen. Zum Beispiel:
<code class="language-javascript">$("table tr:nth-child(2) td:nth-child(3)").addClass("myClass");</code>
Dieser Code fügt der dritten Zelle der zweiten Zeile der Tabelle eine Klasse mit dem Namen "Myclass" hinzu.
5.
mit dem .removeClass()
kann verwendet werden, um Klassen bestimmter Zellen zu entfernen. Zum Beispiel:
<code class="language-javascript">$("table tr:nth-child(2) td:nth-child(3)").removeClass("myClass");</code>
Dieser Code entfernt die Klasse mit dem Namen "Myclass" aus der dritten Zelle in der zweiten Reihe der Tabelle.
6.
Die Hintergrundfarbe einer bestimmten Zelle kann unter Verwendung der .css()
-Methode geändert werden. Zum Beispiel:
<code class="language-javascript">$("table tr:nth-child(2) td:nth-child(3)").css("background-color", "yellow");</code>
Dieser Code ändert die Hintergrundfarbe der dritten Zelle in der zweiten Reihe der Tabelle in Gelb.
7.
Sie können die Methode .append()
verwenden, um der Tabelle eine Zeile hinzuzufügen. Zum Beispiel:
<code class="language-javascript">$("table").append("<tr><td>新单元格</td></tr>");</code>
Dieser Code fügt der Tabelle mit einer Zelle eine Zeile hinzu.
8.
Sie können mit der Methode .remove()
eine Zeile aus der Tabelle entfernen. Zum Beispiel:
<code class="language-javascript">$("table tr:nth-child(2)").remove();</code>
Dieser Code entfernt die zweite Zeile der Tabelle.
9.
Sie können mit der Methode .append()
eine Zelle zu einer bestimmten Zeile der Tabelle hinzufügen. Zum Beispiel:
<code class="language-javascript">function setRowPrice(tableId, rowId, colNum, newValue) { $('#' + tableId).find('tr#' + rowId).find('td:eq(' + colNum + ')').html(newValue); }</code>
Dieser Code fügt der zweiten Zeile der Tabelle eine Zelle hinzu.
10.
Sie können mit der Methode .remove()
eine Zelle aus einer bestimmten Zeile in einer Tabelle entfernen. Zum Beispiel:
<code class="language-javascript">$("table tr:nth-child(2) td:nth-child(3)").html("新值");</code>
Dieser Code entfernt die dritte Zelle in der zweiten Zeile der Tabelle.
Das obige ist der detaillierte Inhalt vonJQuery setzen Wert in spezifischer Tabellenzelle. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!