Javascript 添加表格的值

Question

我的 HTML 代码是这样的

<TR Row="1" CLASS="ThemeAlignCenter">
                <TD id="wrdActive_Row1" style="width: 50px"
                    CLASS="rdThemeDataTableCell"><SPAN id="lblactive_Row1">6</SPAN></TD>

... more rows

我想在页面末尾放置一个 javascript，以便在 lblactive_row1 出现在页面中时添加它的所有值(在本例中为数字 6)

编辑:更多来源

    <TABLE style="" border="0" CLASS="rdThemeDataTable" id="dtWardData"
                cellspacing="0">
                <COL id="wrdActive"></COL>
                <COL id="wrdOccupied"></COL>
                <TR Row="1" CLASS="ThemeAlignCenter">
                    <TD id="wrdActive_Row1" style="width: 50px"
                        CLASS="rdThemeDataTableCell"><SPAN id="lblactive_Row1">4</SPAN></TD>
                    <TD id="wrdOccupied_Row1" style="width: 50px"
                        CLASS="rdThemeDataTableCell"><SPAN id="lblOccupied_Row1">4</SPAN></TD>
                </TR>
            </TABLE>

   <TABLE style="" border="0" CLASS="rdThemeDataTable" id="dtWardData"
                cellspacing="0">
                <COL id="wrdActive"></COL>
                <COL id="wrdOccupied"></COL>

                    <TD id="wrdActive_Row1" style="width: 50px"
                        CLASS="rdThemeDataTableCell"><SPAN id="lblactive_Row1">6</SPAN></TD>
                    <TD id="wrdOccupied_Row1" style="width: 50px"
                        CLASS="rdThemeDataTableCell"><SPAN id="lblOccupied_Row1">2</SPAN></TD>

                </TR>
            </TABLE>

    Repeat...

另外 10 个左右的表也是如此，所有这些都在同一个源中。编辑 html 是不可能的，因为它是由第三方工具生成的。我所能做的就是在最后添加一个小脚本

Answer 1

根据您是否使用 jQuery，您可能需要修改 HTML 以便更轻松地挑选出您需要的元素。

使用 jQuery 你应该能够做这样的事情:

var total = 0;
$('table tr.ThemeAlignCenter > td.rdThemeDataTableCell > span').each(function(i) {
    total += parseInt($(this).text());
});

在没有 jQuery 的情况下，假设您的

data

var tbl = document.getElementById('data');
var cells = tbl.getElementsByTagName('td');

var total = 0;
for (var i = 0, limit = cells.length; i < limit; i++) {
    var td = cells[i];
    if (td.className === 'rdThemeDataTableCell') {
        var elem = td.getElementsByTagName('span')[0];
        total += parseInt(elem.innerHTML);
    }
}

编辑:重构代码，以便它可以应用于每个表(如果表 id 属性无法修改且必须保持相同，应该有望工作):

function sumTable(tbl) {
    var cells = tbl.getElementsByTagName('td');

    var total = 0;
    for (var i = 0, limit = cells.length; i < limit; i++) {
        var td = cells[i];
        if (td.className === 'rdThemeDataTableCell') {
            var elem = td.getElementsByTagName('span')[0];
            total += parseInt(elem.innerHTML);
        }
    }

    return total;
}

var tables = document.getElementsByTagName('table');
var results = [];
for (var i = 0, limit = tables.length; i < limit; i++) {
    var total = sumTable(tables[i]);
    results.push(total);
}

关于Javascript 添加表格的值，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/4885844/

上一篇：javascript - 如果值在 JQuery 中匹配，则手动选择多个下拉选项

下一篇：javascript - javascript异步回调函数之间传递参数

相关文章：

javascript - Nodejs 服务器 - 通过使循环迭代异步来提高性能

javascript - 将 React 中的功能组件转换为基于类的组件

javascript - 比较并返回lodash中的索引

javascript - $location.path 相同的 url 不起作用

javascript - lodash - 基于多个属性创建唯一列表

javascript - Tampermonkey 与 gmail JS API

javascript - 使用 javascript 迭代跨度

javascript - 对象字面量 vs 构造函数+原型(prototype)

php - 提交到 php 文件之前 JavaScript 未运行

javascript - d3 强制删除节点删除关联的边

©2023 IT工具网  联系我们

有一个 的 id，下面这些内容应该会有所帮助: