如何防止我的输出成为Nan？

Question

[我正在尝试制作一个预算应用程序，该应用程序会在扣除费用后的收入之后提醒用户剩余的金额，我的警告一直说Nan。我正在使用for循环来总结来自用户的收入和支出输入。我已经包含了我的代码。

谢谢！

function Maincalc(){
  var incomeVal = document.getElementsByClassName("income");
  var expenseVal = document.getElementsByClassName("expenses");
  var tot = 0;

  for (var i = 0; i < incomeVal.length; i++){
      if(parseInt(incomeVal[i].value))
          var incomeTot = tot + parseInt(incomeVal[i].value);
  }
  for (var i = 0; i < expenseVal.length; i++){
      if(parseInt(expenseVal[i].value))
          var expenseTot = tot + parseInt(expenseVal[i].value);
}
var x = incomeTot - expenseTot;
alert(x);
}

var btn = document.getElementById("submit");

btn.addEventListener("click", Maincalc);

Answer 1

很难看到您的HTML或功能正常的示例，但是我会改变几件事。

[正如其他评论者所说，使用console.log查看代码的部分执行，并查看数字是Nan的位置。

我还将更改此行，这可能是发生错误的地方：

     if(parseInt(expenseVal[i].value))

至：

  if (!isNaN(expenseVal[i].value)) {

要验证该数字是否有效并且是数字；同样，在使用parseInt时，传递第二个参数以确保数字被解析为有效且关于错误，例如parseInt(incomeVal[i].value, 10)。也没有关系，但是在这种情况下，map或reduce函数也将更好。

Answer 2

确保document.getElementsByClassName("income")和document.getElementsByClassName("expenses")返回的DOM节点包含数字值。

income和expenses类代表什么样的DOM节点？请分享HTML代码段