如何在innerText 或nodeValue 之间进行选择？

Question

当我需要更改 span 元素中的文本时，我应该使用哪一个以及有什么区别：

var spnDetailDisplay=document.getElementById('spnDetailDisplay');
spnDetailDisplay.innerText=sDetail;

或者

 var spnDetailDisplay=document.getElementById('spnDetailDisplay');
 spnDetailDisplay.childNodes[0].nodeValue=sDetail;

Answer 1

有关的文本内容元素，它们是相同的。请参阅有关nodeValue信息这MDC文章。

从这篇文章：

  

如果元素没有子元素，只是文字，那么它（通常）具有一个子节点，如ElemRef.childNodes[0]访问。在这种精确的情况下，W3C网络标准等效ElemRef.innerText的是ElemRef.childNodes[0].nodeValue。

Answer 2

• 节点值 是W3C标准推荐。
• 内部文本 是 IE浏览器 具体的，不是标准的。和：
  • 不返回内容 <script> 和 <style>.
  • 样式感知，不返回隐藏元素的文本。
  • CSS样式意识，会触发重排。

然而，截至 2016 年 3 月，所有主要浏览器的版本都支持innerText。

总的来说，它们是相似的，但如果你需要最好的性能， 节点值 应该使用。

性能测试链接： https://jsperf.com/read-innerhtml-vs-innertext-vs-nodevalue-vs-textcontent/13