innerHTML,nodeValue与textContent之间的区别

在 HTML DOM 中，所有事物都是节点。DOM 是被视为节点树的 HTML.DOM中的节点是分好几种类型,

• 整个文档是一个文档节点(document，唯一）
• 每个 HTML 元素是元素节点（标签div,h1,p之类）
• HTML 元素内的文本是文本节点（插入在p,div, span内的文本）
• 每个 HTML 属性是属性节点（class,src这种）
• 注释是注释节点

nodeValue 属性设置或返回指定节点的节点值。

nodeValue 属性的替代选择是 textContent 属性。

innerHTML 属性设置或返回表格行的开始和结束标签之间的 HTML。

举个例子 ：

<p id="prag" title="text">
  这是一段文本
  <span>这是一小句话</span>
</p>
var p = document.getElementById('prag');
p.nodeValue 
//null  因为p是元素节点，所以nodeValue为null
p.getAttributeNode('id').nodeValue    
//prag， 这里获取到p的id属性的属性节点，nodeValue就是它的属性值prag
p.childNodes[0].nodeValue            
/*
"
    这是一段文本
"
p是含有两个子节点的，插入的文本是文本节点。nodeValue是就是写入在其中的字符串，包含换行和缩进
*/
p.innerHTML
/*
"
    这是一段文本
<span>这是一小句话</span>"
这里innerHTML以字符串的形式返回开始和结束标签之间的 HTML。
*/

　　

转载于:https://www.cnblogs.com/Biananrui/p/7491978.html