Question

javascript中Element.nodeValue和innerHTML有什么区别

Answer 1

DOM中的节点是分好几种类型,常见的有
1.文档节点 （document，唯一）
2.元素节点 （那些个标签div,p之类）
3.属性节点（class,src这种）
4.文本节点（插入在p，div内的文本）
其它。。

其中element.nodeValue，是节点的值，其中属性节点和文本节点是有值的，而元素节点没有值。

innerHTML以字符串形式返回该节点的所有子节点及其值

举个例子 ：
<p id="example" title="texts">
这是一段文本
<span></span>
</p>

var p = document.getElementById('example');
p.nodeValue
//null,p是元素节点，所以nodeValue为null
p.getAttributeNode('id').nodeValue
//example，这里获取到p的id属性的属性节点，nodeValue就是它的属性值
p.childNodes[0].nodeValue
/*
"
这是一段文本
"
p是含有两个子节点的，插入的文本虽然没有标签，但它依然是一个节点。
其类型是是文本节点，其nodeValue是就是写入在其中的字符串，包含换行和缩进
*/
p.innerHTML
/*
"
这是一段文本
<span></span>"
这里innerHTML返回了p所包含的全部的节点的所包含的各种值了，以字符串的形式。
*/

Answer 2

定义和用法
innerHTML 属性设置或返回表格行的开始和结束标签之间的 HTML。
定义和用法
nodeType 属性返回以数字值返回指定节点的节点类型。
如果节点是元素节点，则 nodeType 属性将返回 1。
如果节点是属性节点，则 nodeType 属性将返回 2。
　　从下面例子中可以很好的了解区别，举例如下：
　　x=mylist.parentNode.parentNode.parentNode.lastChild 这里返回的是一个最后一个li元素节点。
　　x=mylist.parentNode.parentNode.parentNode.lastChild.firstChild 这里返回的是最后一个li元素节点的第一个子节点，这个子节点在这里是一个文本节点。nodeValue也就是文本节点的文本。
　　而innerHTML是元素对象的属性。在这里是一个文本节点，因而返回underfined.