javascript - 如果满足条件，如何遍历我的 html 并插入文本？

Question

我正在尝试编写一个生成跨度标记并在满足条件时注入(inject)一些文本的函数，但我一直收到 [object HTMLSpanElement]。我是否错误地使用了 innerText 和 innerHTML？

JavaScript:

function checkBlankReviews(){

  var reviewTexts = document.querySelectorAll('p.text');

  Array.prototype.forEach.call(reviewTexts, function (item) { // iterate the elements

      if (item.innerText === '') {
          var span = document.createElement('span');
          span.innerText = "No Reviews";
          item.innerHTML = span;
          
          console.log('no reviews for: ' + item.innerHTML);
      } 

    return item;
    
  });


}

这是我的 jsbin

Answer 1

问题在于:

item.innerHTML = span;

innerHTML 需要一个字符串，所以这基本上会变成

item.innerHTML = span.toString();

这是您最终获得 [object HTMLSpanElement] 的地方。相反，您似乎只想要您构建的 span 元素的 html。 outerHTML^MDN将为您解决。

item.innerHTML = span.outerHTML;