javascript - 未捕获( promise )TypeError : Cannot set property 'innerHTML' of null

Question

我了解到存在与此问题类似的问题。我花了时间仔细研究它们。但这里的实现与我看到的一些案例略有不同。好消息是我的第四列，即运行总计列，正确显示了我想要的数据。一切正常(正确计算和显示)，那么为什么我的应用程序在这方面停滞不前？我会很感激。谢谢。

calculateRunningTotals(){
        var attendantTotalCell = 0;
        var total = 0;
        var totalCell="";
        var totalsCells = document.querySelectorAll("td:nth-child(3)");

        totalsCells.forEach(function(cell, index){
          console.log("The contents of the totals cell " + cell.innerText);
          totalCell = cell.innerText;
          attendantTotalCell = totalCell.replace(/[^0-9-.]/g, '');
          total = parseInt(attendantTotalCell) + parseInt(total);
          console.log("Attendant Total Cell is: " + attendantTotalCell);
          console.log("Attendant Total is " + total);
          cell.nextElementSibling.innerHTML = total;
        })
      }

Answer 1

如果您添加以下检查以确保定义了 cell.nextElementSibling，那么这应该可以解决您的问题:

calculateRunningTotals(){
    var attendantTotalCell = 0;
    var total = 0;
    var totalCell="";
    var totalsCells = document.querySelectorAll("td:nth-child(3)");

    totalsCells.forEach(function(cell, index){
      console.log("The contents of the totals cell " + cell.innerText);
      totalCell = cell.innerText;
      attendantTotalCell = totalCell.replace(/[^0-9-.]/g, '');
      total = parseInt(attendantTotalCell) + parseInt(total);
      console.log("Attendant Total Cell is: " + attendantTotalCell);
      console.log("Attendant Total is " + total);

      /* Add the following check to ensure nextElementSibling is defined
         before attempting to access it */
      if(cell.nextElementSibling) {
        cell.nextElementSibling.innerHTML = total;
      }
    })
  }