HTML中的Node和Element的区别

元素(Element)和结点(Node)的区别,元素是一个小范围的定义,必须是含有完整信息的结点才是一个元素,例如<div>…</div>。但是一个结点不一定是一个元素,而一个元素一定是一个结点。

HTML-Guidelines-for-Usability-SEO
什么是node:

NODE是相对TREE这种数据结构而言的。TREE就是由NODE组成。这个部分你可以参考离散数学的树图。

什么是element

ELEMENT则是HTML里的概念,是元素即标签包含内部属性及内容的总体,是HTML中的数据的组成部分之一。

从范围上讲DOM将文档中的所有都看作节点,也就是说node>element

1.DOM在解析文档的时候按整个文档的结构生成一棵树,全部保存在内存。优点就是整个文档都一直在内存中,我们可以随时访问任何节点,并且对树的遍历也是比较熟悉的操作;缺点则是耗内存,并且必须等到所有的文档都读入内存才能进行处理。

2.一个需要注意的地方就是,HTML文档两个标签之间的空白也是这棵树的一个节点(Text节点)。 <a> <b></b> <a> 中a有三个节点。

node有几个子类型:Element,Text, Attribute,RootElement,Comment,Namespace等。

综上理解:Element是可以有属性和子节点的node。Element是从Node继承的。

除以上需要了解的,我们还需要js操作元素节点的另一种方法Element Traversal Specification。该接口是w3c在2008年12月22日发布的规范,用于Element Traversal规范定义了ElementTraversal接口,它允许脚本遍历DOM树中的元素(element)节点,而不包含元素节点之外的其他节点,如注释节点、文字节点等。这个规范给我们提供了快速、方便的方法来访问元素节点。在以前的方法中,我们使用firstChild、nextSibling、childNodes、childrem等方法来进行遍历,但要得到元素节点,我们还需要来判断节点的类型。

ElementTraversal接口定义了5个属性,是元素节点必须要实现的,这5个属性的原始定义如下,这些属性,看名字就不难明白它的含义,不进行翻译成中文了:

firstElementChild:Returns the first child element node of this element. null if this element has no child elements.

lastElementChild:Returns the last child element node of this element. null if this element has no child elements.

previousElementSibling:Returns the previous sibling element node of this element. null if this element has no element sibling nodes that come before this one in the document tree.

nextElementSibling:Returns the next sibling element node of this element. null if this element has no element sibling nodes that come after this one in the document tree.

childElementCount:Returns the current number of element nodes that are children of this element. 0 if this element has no child nodes that are of nodeType .


from: http://www.smallhead.cn/technology/64.html

发布了12 篇原创文章 · 获赞 77 · 访问量 125万+
展开阅读全文

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 大白 设计师: CSDN官方博客

分享到微信朋友圈

×

扫一扫,手机浏览