jQueryを使用してtd要素をループし、それらを合計する方法

Web 開発では、jQuery は一般的に使用される JavaScript ライブラリであり、一般的に使用される多数の DOM 操作をカプセル化し、開発者の作業を簡素化します。一般的なニーズの 1 つは、テーブルの列を合計することです。この記事では、jQuery を使用して td 要素を走査し、それらを合計する方法を紹介します。

単純なテーブルの場合、最初にテーブルの tbody 部分を取得する必要があります。これを実現するには、次のコードを使用できます:

var tbody = $('table tbody');

次に、tr の各行を走査する必要があります。の各 td について、合計する必要がある列を見つけて、td 内の数値を合計します。コードは次のとおりです。

// 需要求和的列的索引值
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);

上記のコードでは、columnIndex 変数は合計する必要がある列のインデックス値を表し、sum 変数は列内の数値を累積するために使用されます。 tbody の各 tr を走査するときは、find メソッドを使用して行の columnIndex にある td を検索し、parseInt を使用して td の内容を数値に変換し、合計に加算します。

実際に使用する場合は以下の点に注意する必要があります:

1. tdの内容が数値かどうかを判定する必要があり、数値でない場合は、 td はスキップするか、0 として扱う必要があります。
2. 浮動小数点数の合計の場合、精度の問題により、小数点の後に余分な桁が存在する可能性があるため、これは避けてください。たとえば、各 td の浮動小数点数を小数点第 2 位まで合計したり、合計する前にすべての数値を整数に変換したりできます。
3. 複数のテーブルの同じ列を合計する必要がある場合は、各テーブルに対して上記のコードを個別に使用するか、コードを関数にカプセル化して任意のテーブルの合計を実装することができます。

要約すると、jQuery を使用して td と sum を走査するのは比較的単純な操作ですが、精度の問題と数値以外のコンテンツの処理方法に注意する必要があります。この操作に習熟すると開発効率が大幅に向上します。

以上がjQueryを使用してtd要素をループし、それらを合計する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。