为何input.value返回undefined？JavaScript表格取值问题

核心问题1：错误获取元素的value属性 #

你弹窗alert(row.cells[7].value)得到undefined，是因为row.cells[7]对应的是<td>元素，td元素本身没有value属性——真正存储数值的是td内部的<input>标签，直接取td的value必然返回undefined。

核心问题2：innerHTML拼写错误+取值对象错误 #

求和时用row.cells[7].innerhtml，首先JavaScript是大小写敏感的，正确写法是innerHTML；其次，就算拼写正确，td的innerHTML是包含input标签的HTML字符串（比如<input type='number' value=123>），并非input的实际数值，用parseFloat解析这种字符串会得到NaN，加上||0虽不会报错，但也拿不到正确值。

修复后的求和代码示例 #

var total = 0; // 务必初始化total变量
var table = document.getElementById("myTablesecond");

for (var i = 1, row; row = table.rows[i]; i++) {
    // 先获取td内的input元素，再读取它的value
    var inputElement = row.cells[7].querySelector('input');
    var inputValue = inputElement ? inputElement.value : 0;
    alert(inputValue); // 现在能拿到正确数值
    total += parseFloat(inputValue) || 0;
}

额外优化点：HTML拼接的属性引号问题 #

你拼接input的value时未加引号，比如value=" + bud + "，如果bud是带空格的内容或字符串，会导致HTML语法错误。建议给value属性加上引号：

// 修改input部分的拼接逻辑，例如：
"<td><input type='number' value='" + bud + "'></input></td>"
// 或者用转义双引号包裹：
"<td><input type='number' value=\"" + bud + "\"></input></td>"

内容的提问来源于stack exchange，提问作者Gizmo Dailys