javascript:获取平均值时为 NaN

Question

所以我跟着这个 fiddle :http://jsfiddle.net/4h6w64d8/2/但不幸的是，当我尝试代码时，平均值为 NaN。在 fiddle 中，即使列没有值，它仍然会计算并显示平均值。但是当我尝试时，它只会显示 NaN。

这是我的 html:

<table id="scorecard_student" class="table table-striped table-bordered">
<thead>
    <tr>
        <th>Code </th>
        <th>PO 1</th>
        <th>PO 2</th>
        <th>PO 3</th>
        <th>PO 4</th>
        <th>PO 5</th>
        <th>PO 6</th>
        <th>PO 7</th>
        <th>PO 8</th>
        <th>PO 9</th>
    </tr>
</thead>
<tbody>
    <tr>
        <td width="7%">ICT117</td>
        <td></td>
        <td></td>
        <td></td>
        <td>2.0</td>
        <td></td>
        <td>2.0</td>
        <td></td>
        <td></td>
        <td>1.5</td>

    </tr>
    <tr>
        <td width="7%">ICT118</td>
        <td></td>
        <td></td>
        <td>2.0</td>
        <td>2.0</td>
        <td></td>
        <td></td>
        <td></td>
        <td>2.0</td>
        <td>1.5</td>

    </tr>
    <tr>
        <td width="7%">ICT110</td>
        <td>3.0</td>
        <td>2.0</td>
        <td></td>
        <td></td>
        <td></td>
        <td>2.0</td>
        <td></td>
        <td></td>
        <td></td>

    </tr>
    <tr>
        <td width="7%">ICT111</td>
        <td></td>
        <td></td>
        <td></td>
        <td>2.0</td>
        <td>2.0</td>
        <td>2.0</td>
        <td>1.5</td>
        <td></td>
        <td></td>

    </tr>
</tbody>
<tfoot>
    <tr bgcolor="#FFF380">
        <td>
            <center>Average</center>
        </td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
    </tr>
</tfoot>
</table> 

我的js:

<script type="text/javascript">
    var table = document.getElementById('scorecard_student'),
        rows = table.getElementsByTagName('tbody')[0].getElementsByTagName('tr'),
        footer = table.getElementsByTagName('tfoot')[0];


    for (var i = 1; i <= <? php echo $po_count; ?> ; i++) {
        var sum = numOfValues = 0;
        for (var j = 0, l = rows.length; j < l; j++) {
            try {
                sum += parseFloat(
                    rows[j].getElementsByTagName('td')[i]
                    .innerHTML
                );
                numOfValues++;
            } catch (e) {}
        }

        var avg = sum / numOfValues;
        footer.getElementsByTagName('td')[i]
            .innerHTML = Math.round(avg * 100) / 100;
    }
</script>

更新，我想我现在明白了。

if (rows[j].getElementsByTagName('td')[i].innerHTML != '') {
    sum += parseFloat(
        rows[j].getElementsByTagName('td')[i]
        .innerHTML
    ) || 0;

    numOfValues++;
}

Answer 1

在某些情况下，您会得到空白文本，您需要跳过它:

 sum += parseFloat(
            rows[j].getElementsByTagName('td')[i]
            .innerHTML
          ) || 0; //<--