昆明java培训
达内昆明广州春城路

18487146383

热门课程

节点类型

  • 时间:2016-08-31
  • 发布:昆明Java培训
  • 来源:达内新闻

昆明Java培训班的老师今天给大家讲节点类型。

1、节点类型

HTML文档中的所有内容都是节点(node):

整个文档是一个文档节点

每个HTML元素是元素节点

HTML元素内的文本是文本节点(回车也是文本节点)

每个HTML的属性是属性节点getAttributeNode("id")

注释是注释节点

各节点获取的代码:

2、nodeName属性返回节点的名称

元素节点的nodeName是标签名称(大写)

属性节点的nodeName是属性名称

文本节点的nodeName永远是#text

文档节点的nodeName永远是#document

注释节点的nodeName永远是#comment

3、nodeValue属性返回节点的值

对于元素节点,nodeValue返回值是undefined或null

对于文本节点,nodeValue返回文本内容

对于属性节点,nodeValue返回属性值

对于注释节点,nodeValue返回注释内容

对于元素节点,用innerHTML设置值/获取值

4、nodeType属性返回一个整数,这个数值代表节点的类型

常用的节点类型是:

元素节点返回1属性节点返回2文本节点返回3

注释节点返回8文档节点返回9

1 <body>

2 <div id="box1">aaa<span>标签11</span></div>

3 <div id="box2"><!--注释abc -->bbb<span>标签22</span></div>

4 <script>

5 /*节点的获取*/

6 var box1=document.getElementById('box1');//元素节点

7 var box2=document.getElementById('box2');//元素节点

8 var attr=box1.getAttributeNode('id');//注释节点

9 var txt=box1.firstChild;//文本节点

10 var comme=box2.firstChild;//注释节点

11 var doc=document;//文档节点

12

13 /*nodeName属性返回节点的名称*/

14 console.log(box1.nodeName);//DIV(标签名称)---元素节点

15 console.log(box2.nodeName);//DIV(标签名称)---元素节点

16 console.log(attr.nodeName);//id(属性名称)---属性节点

17 console.log(txt.nodeName);//#text---文本节点nodeName永远是#text

18 console.log(comme.nodeName);//#comment---注释节点的nodeName永远是#comment

19 console.log(doc.nodeName);//#document---文档节点的nodeName永远是#document

20

21 /*nodeValue属性返回节点的值*/

22 console.log(box1.nodeValue);//null---元素节点返回值为undefined或null

23 console.log(box1.innerHTML);//aaa<span>标签11</span>对于元素节点,用innerHTML设置值/获取值

24 console.log(box1.innerText);//aaa标签11

25 console.log(box2.nodeValue);//null

26 console.log(attr.nodeValue);//box1

27 console.log(txt.nodeValue);//aaa

28 console.log(comme.nodeValue);//注释abc

29 console.log(doc.nodeValue);//null

30

31 /*nodeType属性返回一个整数,这个数值代表节点的类型*/

32 console.log(box1.nodeType);//1--元素节点

33 console.log(box2.nodeType);//1--元素节点

34 console.log(attr.nodeType);//2--属性节点

35 console.log(txt.nodeType);//3--文本节点

36 console.log(comme.nodeType);//8--注释节点

37 console.log(doc.nodeType);//9--文档节点

38 </script>

39 </body>

了解详情请登陆昆明达内Java培训官网(km.Java.tedu.cn)!

上一篇:DOM文档对象模型
下一篇:节点关系

AI初创企谷歌跑在前面了!达内java培训

‘资产荒’为什么这么说?【达内培训】

java集合-Iterator迭代

阿里云澳门战略携手创“城市大脑”——达内编程培训

选择城市和中心
贵州省

广西省

海南省

台湾