Heim > Web-Frontend > Front-End-Fragen und Antworten > So durchlaufen Sie td-Elemente und summieren sie mit jQuery

So durchlaufen Sie td-Elemente und summieren sie mit jQuery

PHPz
Freigeben: 2023-04-10 14:29:21
Original
954 Leute haben es durchsucht

In der Webentwicklung ist jQuery eine häufig verwendete JavaScript-Bibliothek. Sie kapselt eine große Anzahl häufig verwendeter DOM-Operationen und vereinfacht die Arbeit von Entwicklern. Eine der häufigsten Anforderungen besteht darin, eine bestimmte Spalte der Tabelle zu summieren. In diesem Artikel wird erläutert, wie Sie td-Elemente mit jQuery durchlaufen und summieren.

Für eine einfache Tabelle müssen Sie zuerst den tbody-Teil der Tabelle abrufen. Dazu können Sie den folgenden Code verwenden:

var tbody = $('table tbody');
Nach dem Login kopieren

Als nächstes müssen Sie jede Zeile von tr im tbody durchlaufen und dann jede td in der Zeile, um die erforderliche Summe zu finden. Summieren Sie die Spalten und addieren Sie die Zahlen in td. Der Code lautet wie folgt:

// 需要求和的列的索引值
var columnIndex = 1;
// 用于累加列中的数字
var sum = 0;

// 遍历每个 tr
tbody.find('tr').each(function() {
  // 找到需要求和的列
  var td = $(this).find('td').eq(columnIndex);
  // 将该列中的数字累加起来
  sum += parseInt(td.text());
});

// 输出求和结果
console.log('总和为:' + sum);
Nach dem Login kopieren

Im obigen Code stellt die Variable columnsIndex den Indexwert der Spalte dar, die summiert werden muss, und die Variable sum wird zum Akkumulieren der Zahlen in der Spalte verwendet. Wenn Sie jedes tr in tbody durchqueren, verwenden Sie die Methode find, um den td zu finden, der sich in der Zeile in columnsIndex befindet, und verwenden Sie dann parseInt, um den Inhalt von td in Zahlen umzuwandeln und diese zur Summe zu addieren.

Bei der tatsächlichen Verwendung müssen Sie außerdem auf die folgenden Punkte achten:

  1. Sie müssen beurteilen, ob der Inhalt in td eine Zahl ist. Wenn es sich nicht um eine Zahl handelt, sollten Sie td überspringen oder als 0 behandeln .
  2. Bei der Summe von Gleitkommazahlen kann es aufgrund von Genauigkeitsproblemen zu zusätzlichen Nachkommastellen kommen. Dies sollte vermieden werden. Sie können beispielsweise die Gleitkommazahlen in jedem td auf zwei Dezimalstellen summieren oder alle Zahlen vor der Summierung in Ganzzahlen umwandeln.
  3. Wenn Sie dieselben Spalten in mehreren Tabellen summieren müssen, können Sie den obigen Code für jede Tabelle separat verwenden oder den Code in eine Funktion kapseln, um jede Tabelle zu summieren.

Zusammenfassend lässt sich sagen, dass die Verwendung von jQuery zum Durchlaufen von td und sum ein relativ einfacher Vorgang ist. Sie müssen jedoch auf Genauigkeitsprobleme und den Umgang mit nicht numerischen Inhalten achten. Wenn Sie diesen Vorgang beherrschen, kann die Entwicklungseffizienz erheblich verbessert werden.

Das obige ist der detaillierte Inhalt vonSo durchlaufen Sie td-Elemente und summieren sie mit jQuery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage