如何使用jQuery获取动态生成表格各自的总计值？

没问题，我来帮你搞定这个每个表格单独算总计的需求！你现在的代码是把所有.customduty元素的值加在一起，没有区分它们属于哪个表格，所以才会没法单独统计。咱们只需要调整一下逻辑，先遍历每个表格，再在每个表格内部计算总计就行。

修改后的代码示例 #

function customduty() {
  // 先拿到页面上所有的表格元素
  const allTables = document.querySelectorAll('table');

  // 逐个处理每个表格
  allTables.forEach((singleTable, tableIndex) => {
    let tableCustomDutyTotal = 0;
    // 只在当前这个表格里找所有.customduty元素，而不是全局查找
    const tableAmounts = singleTable.querySelectorAll('.customduty');

    // 累加当前表格里的所有目标值
    tableAmounts.forEach(amountElement => {
      // 把文本内容转成数字，防止出现字符串拼接的情况；如果内容不是数字就加0
      const amountValue = parseFloat(amountElement.textContent) || 0;
      tableCustomDutyTotal += amountValue;
    });

    // 这里可以根据你的需求处理每个表格的总计值
    console.log(`第${tableIndex + 1}个表格的customduty总计: ${tableCustomDutyTotal}`);

    // 示例：如果你的表格有专门放总计的单元格（比如类名叫table-customduty-total），可以直接赋值
    const totalCell = singleTable.querySelector('.table-customduty-total');
    if (totalCell) {
      totalCell.textContent = tableCustomDutyTotal.toFixed(2); // 保留两位小数，更规范
    }
  });
}

关键逻辑说明 #

• 范围限定查找：用singleTable.querySelectorAll('.customduty')代替全局的document.querySelectorAll，这样只会获取当前表格内的目标元素，不会跨表格累加。
• 单个表格独立统计：每个表格都有自己的tableCustomDutyTotal变量，互不干扰。
• 数值安全处理：用parseFloat转换文本，加上|| 0防止遇到非数字内容时报错或者出现NaN。
• 灵活展示结果：你可以把总计值打印到控制台，或者插入到表格的指定位置（比如表格底部的总计行），根据你的页面结构调整就行。

额外注意事项 #

• 如果你的表格是动态生成的，要确保在表格渲染完成后再调用这个函数，比如在动态生成表格的代码执行完毕后调用customduty()。
• 如果.customduty元素的文本里有非数字内容（比如货币符号$、逗号,），需要先清理掉，比如用amountElement.textContent.replace(/[^0-9.]/g, '')再转换为数字。

内容的提问来源于stack exchange，提问作者Errol Boneo