我完全搞不清Node对象和Element对象。
document.getElementById()返回Element对象，而document.getElementsByClassName()
返回节点列表对象(元素或节点的集合?)
如果div是一个元素对象，那么div Node对象呢?
什么是节点对象?
文档对象、元素对象和文本对象也是节点对象吗?
根据David Flanagan的书“文档对象，它的元素对象和文本对象都是节点对象”。
那么一个对象是如何继承元素对象以及节点对象的属性/方法的呢?
如果是，我猜节点类和元素类在继承的原型树中是相关的。
<div id="test">
<p class="para"> 123 </p>
<p class="para"> abc </p>
</div>
<p id="id_para"> next </p>
document.documentElement.toString(); // [object HTMLHtmlElement]
var div = document.getElementById("test");
div.toString(); // [object HTMLDivElement]
var p1 = document.getElementById("id_para");
p1.toString(); // [object HTMLParagraphElement]
var p2 = document.getElementsByClassName("para");
p2.toString(); //[object HTMLCollection]
节点:http://www.w3schools.com/js/js_htmldom_nodes.asp
Node对象表示文档树中的单个节点。
节点可以是元素节点、属性节点、文本节点或“节点类型”一章中解释的任何其他节点类型。
元素:http://www.w3schools.com/js/js_htmldom_elements.asp
Element对象表示XML文档中的一个元素。元素可以包含属性、其他元素或文本。如果元素包含文本，则文本用文本节点表示。
复制:
XML中的元素和节点有什么区别?
为什么XML中的节点和元素不同?理由是什么?
节点是DOM层次结构中任何类型对象的通用名称。节点可以是内置DOM元素之一，如document或document。body，它可以是HTML中指定的HTML标记，如<input>或<p>，也可以是由系统创建的文本节点，用于在另一个元素中保存文本块。因此，简而言之，节点是任何DOM对象。
元素是一种特定类型的节点，因为还有许多其他类型的节点(文本节点、注释节点、文档节点等等)。
DOM由一个节点层次结构组成，其中每个节点可以有一个父节点、一列子节点以及nextSibling和previousSibling。这种结构形成了一个树状的层次结构。文档节点将html节点作为它的子节点。
html节点有它的子节点列表(头节点和主体节点)。主体节点将有它的子节点列表(HTML页面中的顶级元素)等等。
所以，nodeList只是一个类似数组的节点列表。
元素是一种特定类型的节点，可以在HTML中使用HTML标记直接指定，并且可以具有id或类之类的属性。可以生孩子等等…还有其他类型的节点，如注释节点、文本节点等等……有不同的特点。每个节点都有一个. nodetype属性，用于报告节点的类型。你可以在这里看到各种类型的节点(图表来自MDN):
您可以看到ELEMENT_NODE是一种特定类型的节点，其中nodeType属性的值为1。
因此document.getElementById("test")只能返回一个节点，并且它保证是一个元素(特定类型的节点)。因此，它只返回元素而不是列表。
Since document.getElementsByClassName("para") can return more than one object, the designers chose to return a nodeList because that's the data type they created for a list of more than one node. Since these can only be elements (only elements typically have a class name), it's technically a nodeList that only has nodes of type element in it and the designers could have made a differently named collection that was an elementList, but they chose to use just one type of collection whether it had only elements in it or not.
编辑:HTML5定义了一个HTMLCollection，它是HTML元素的列表(不是任何节点，只有元素)。HTML5中的许多属性或方法现在返回一个HTMLCollection。虽然它在接口上与nodeList非常相似，但现在的区别在于它只包含element，而不包含任何类型的节点。
nodeList和HTMLCollection之间的区别对你如何使用它没有什么影响(据我所知)，但是HTML5的设计者现在已经做出了这种区分。
例如，元素。children属性返回一个实时的HTMLCollection。
Element继承自Node，就像Dog继承自Animal一样。
一个Element对象“是”节点对象，就像一个Dog对象“是”动物对象一样。
Node是用来实现树结构的，所以它的方法有firstChild, lastChild, childNodes等。它更像是一个泛型树结构的类。
然后，一些Node对象也是Element对象。元素继承自Node。元素对象实际上表示HTML文件中通过诸如<div id="content"></div>等标记指定的对象。Element类定义了属性和方法，如attributes、id、innerHTML、clientWidth、blur()和focus()。
有些Node对象是文本节点，而不是Element对象。每个Node对象都有一个nodeType属性，用于指示它是什么类型的节点，对于HTML文档:
1: Element node
3: Text node
8: Comment node
9: the top level node, which is document
我们可以在控制台中看到一些例子:
> document instanceof Node
true
> document instanceof Element
false
> document.firstChild
<html>...</html>
> document.firstChild instanceof Node
true
> document.firstChild instanceof Element
true
> document.firstChild.firstChild.nextElementSibling
<body>...</body>
> document.firstChild.firstChild.nextElementSibling === document.body
true
> document.firstChild.firstChild.nextSibling
#text
> document.firstChild.firstChild.nextSibling instanceof Node
true
> document.firstChild.firstChild.nextSibling instanceof Element
false
> Element.prototype.__proto__ === Node.prototype
true
上面的最后一行显示了Element继承自Node。(这一行不会在IE中工作，因为__proto__。将需要使用Chrome, Firefox或Safari)。
顺便说一下，document对象是节点树的顶部，document是一个document对象，document也继承自node:
> Document.prototype.__proto__ === Node.prototype
true
下面是Node和Element类的一些文档:
https://developer.mozilla.org/en-US/docs/DOM/Node
https://developer.mozilla.org/en-US/docs/DOM/Element
