Javascript解析html添加表的值

时间:2011-02-03 14:39:34

标签: javascript

我的HTML代码看起来像这样

    <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是不可能的,因为它是由第三方工具生成的。我需要的是在末尾添加一个小脚本来添加lblactive_Row1的所有值(本例中为4和6)

1 个答案:

答案 0 :(得分:1)

建议不要使用重复的ID使用类

window.onload = function() {
    var data = document.getElementsByTagName('span');
    var result = 0;
    for (var i = 0; i < data.length; i++) {
        if (data[i].id == 'lblactive_Row1') {
            result += parseInt(data[i].innerHTML, 10);
        }
    }

    console.log(result);
};

以下是jsfiddle