Javascript添加表的值

我的HTML代码如下所示

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

... more rows

6.
... 更多行

我想在页面末尾添加一个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...

4.
4.
6.
2.
重复。。。

---

对于另外10个左右的表，也是这样，都在同一个源中。编辑html是不可能的，因为它是由第三方工具生成的。我所能做的就是在末尾添加一个小脚本，这取决于您是否使用jQuery，您可能需要修改HTML，以便更容易地选择所需的元素

使用jQuery，您应该能够执行以下操作：

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

如果没有jQuery，假设您有一个数据id，以下几点应该会有所帮助：

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);
    }
}

var tbl=document.getElementById（'data'）；
var cells=tbl.getElementsByTagName（'td'）；
var合计=0；
对于（变量i=0，限制=cells.length；i

编辑：重构代码，以便将其应用于每个表（如果表id属性无法修改且必须保持相同，则有望工作）：

功能汇总表（tbl）{
var cells=tbl.getElementsByTagName（'td'）；
var合计=0；
对于（变量i=0，限制=cells.length；i

类似的方法可能会奏效：

function totalRows() {
    var total = 0;
    var spans = document.getElementsByTagName('span');

    for(var i=0; i<spans.length; i++) {
        if(spans[i].getAttribute('id') === 'lblactive_Row1') {
            total += parseInt( spans[i].innerHTML, 10);
        }
    }

    return total;
}

函数totalRows（）{
var合计=0；
var span=document.getElementsByTagName（'span'）；
对于（var i=0；我在何处添加值？其他跨距是否具有诸如“lblactive_Row2”、“lblactive_Row3”之类的ID？@martjin。不，所有跨距都称为lblactive_row1@awias将这些值加在一起就像一个小提示一样，你不应该再使用大写HTML标记，或者至少不要混合使用大写、小写和混合大写。保持一致。这有助于你自己结束！您忘记在
parseInt
函数调用中指定基数。
parseInt（'010'）
将返回8，而不是10；
parseInt（'010'，10）
将返回10。不，它们lblactive不执行。它们都称为lblactive_Row1@user521180删除了id属性中的增量id。@Martjin对parseInt的理解很好，我也添加了这个。我正在尝试这个，但它不起作用。我甚至没有得到一个exmpty警报var tbl=document.getElementById（'dtWardData'））；var cells=tbl.getElementsByTagName（'wrdActive_Row1'）；var total=0；for（var i=0；i<10；i++）{var td=cells[i]；if（td.className='rdThemeDataTableCell'）{var elem=td.getElementsByTagName（'span'）[0]；total+=parseInt（elem.innerHTML）；}alert（total）}所有的单元格都有相同的名称，它们在整个页面上重复出现，因为我有3个页面嵌套在一起。所有的表都是用相同的HTML id输出的吗？如果是，我想知道这是否会导致问题？
function totalRows() {
    var total = 0;
    var spans = document.getElementsByTagName('span');

    for(var i=0; i<spans.length; i++) {
        if(spans[i].getAttribute('id') === 'lblactive_Row1') {
            total += parseInt( spans[i].innerHTML, 10);
        }
    }

    return total;
}