javascript - 无法设置 null 的属性 'nodeValue'，需要解释

Question

我知道有人问过这个问题，我也搜索过但找不到类似的案例，所以我决定再次问这个问题。

谁能告诉我这里的问题是什么，因为前两个 Axis-X 和 Axis-Y 工作完美，但它的 Axis-Z 给了我

"Cannot set property 'nodeValue' of null"

我的网站出现错误。
我面临的确切问题是前两个，Axis-X 和 Axis-Y 确实毫无问题地传递了值，只有 Axis-Z 给了我上面的错误，我的问题是，为什么它会给我这个错误，并且为什么只有这一个而不是全部 3 个。请注意，Axis-Z if 语句中的 msg.payload 确实携带了其假设的值。

这是 JavaScript:

 if (index.contains('Gyroscope')) { //Get all data from Gyroscope queue

    if((index.indexOf('Axis-X')) >= 0){//X-Axis queue  && 'X-Axis'
      // var sendData1 = msg.payload;
      // printText("gyrX", sendData1); //Publish data to the textArea
      // //console.log("I send Axis-X");
      document.getElementById('gyrX').firstChild.nodeValue = msg.payload;
    };

    if((index.indexOf('Axis-Y')) >= 0){
      // var sendData1 = msg.payload;
      // printText("gyrY", sendData1); //Publish data to the textArea
      // //console.log("I send Axis-Y");
      document.getElementById('gyrY').firstChild.nodeValue = msg.payload;
    };

    if((index.indexOf('Axis-Z')) >= 0){
      //var sendData1 = msg.payload;
      //printText("gyrZ", msg.payload); //Publish data to the textArea
      console.log("I send Axis-Z" + msg.payload);
      document.getElementById('gyrZ').firstChild.nodeValue = msg.payload;
    };
  };

这是 Jade :

  main.hoc.container.clear(styles='width:100%;')
    .sidebar.four_quarter.first(styles='width:30%;')
      table
        tr
          th(colspan='4')  Gyroscope Readings
        tr
          td(style='width:50%;') Gyroscope X:
          td(style='width:50%;')
            span#gyrX  
        tr
          td(style='width:50%;') Gyroscope Y:
          td(style='width:50%;')
            span#gyrY  
        tr
          td(style='width:50%;') Gyroscope Z:
          td(style='width:50%;')
            span#gyrZ
      p
        | Note: Sensor accuracy at current configuration can have a difference of 5 degree, calibration is needed.
      p
        | Note: Sensor takes the angle it was turned on at as 0 degree, make sure that everything is leveled before turning system on.
      br

在来到这里之前我简化了代码，这就是为什么很多内容都被注释掉了。另外，有人可以向我解释一下，为什么会发生这种情况吗？

Answer 1

您的 Jade 定义了许多没有内容的 span 元素。

您的 JavaScript 尝试访问这些跨度的第一个子节点(期望在那里找到文本节点)并失败，因为没有内容，因此没有文本节点。

设置the textContent跨度的值，而不是其第一个子节点的 nodeValue。