×

你了解过HTML之DOM nodeType属性吗?

作者:Web前端之家2020.03.30来源:Web前端之家浏览:3278评论:1
关键词:htmlnodeTypedom
微信公众号

微信公众号

500.jpg

空余之时,了解下HTML里的DOM nodeType属性;简单来说,它的作用是获得 body 元素的节点类型:

document.body.nodeType;

//输出
1

定义和用法

nodeType 属性返回以数字值返回指定节点的节点类型。

如果节点是元素节点,则 nodeType 属性将返回 1。

如果节点是属性节点,则 nodeType 属性将返回 2。

所有主流浏览器均支持 nodeType 属性。

语法

node.nodeType

技术细节

返回值:字符串值,代表节点的节点类型。
DOM 版本Core Level 1 Node Object

Node Types

文档、元素、属性以及 HTML 或 XML 文档的其他方面拥有不同的节点类型。

存在 12 种不同的节点类型,其中可能会有不同节点类型的子节点:

节点类型描述子节点
1Element代表元素Element, Text, Comment, ProcessingInstruction, CDATASection, EntityReference
2Attr代表属性Text, EntityReference
3Text代表元素或属性中的文本内容。None
4CDATASection代表文档中的 CDATA 部分(不会由解析器解析的文本)。None
5EntityReference代表实体引用。Element, ProcessingInstruction, Comment, Text, CDATASection, EntityReference
6Entity代表实体。Element, ProcessingInstruction, Comment, Text, CDATASection, EntityReference
7ProcessingInstruction代表处理指令。None
8Comment代表注释。None
9Document代表整个文档(DOM 树的根节点)。Element, ProcessingInstruction, Comment, DocumentType
10DocumentType向为文档定义的实体提供接口None
11DocumentFragment代表轻量级的 Document 对象,能够容纳文档的某个部分Element, ProcessingInstruction, Comment, Text, CDATASection, EntityReference
12Notation代表 DTD 中声明的符号。None

节点类型 - 返回值

对于每种节点类型,nodeName 和 nodeValue 属性的返回值:

节点类型nodeName 返回nodeValue 返回
1Element元素名null
2Attr属性名称属性值
3Text#text节点的内容
4CDATASection#cdata-section节点的内容
5EntityReference实体引用名称null
6Entity实体名称null
7ProcessingInstructiontarget节点的内容
8Comment#comment注释文本
9Document#documentnull
10DocumentType文档类型名称null
11DocumentFragment#document 片段null
12Notation符号名称null

NodeTypes - Named Constants

NodeTypeNamed Constant
1ELEMENT_NODE
2ATTRIBUTE_NODE
3TEXT_NODE
4CDATA_SECTION_NODE
5ENTITY_REFERENCE_NODE
6ENTITY_NODE
7PROCESSING_INSTRUCTION_NODE
8COMMENT_NODE
9DOCUMENT_NODE
10DOCUMENT_TYPE_NODE
11DOCUMENT_FRAGMENT_NODE
12NOTATION_NODE

温馨提示:本文作者系Web前端之家 ,经Web前端之家编辑修改或补充,转载请注明出处和本文链接:
https://jiangweishan.com/article/html7uuiu2348293084098.html

网友评论文明上网理性发言 已有1人参与

发表评论:

评论列表

最新留言

  • Web前端之家

    GoogleAdSense可以的,可以加群主,帮你搞定这事情~~...

  • s121

    GoogleAdSense好弄吗,想弄一个账号。...

  • s121

    不错,正好用到,收藏了!...

  • 访客

    什么机翻...

  • Web前端之家

    只是更轻便,还是有些差距的呢,小项目可以玩玩。...

  • ja124

    这个跟vue和react比,好些吗?...

  • Web前端之家

    OK,已经更新,谢谢!...

  • 韩涛博客

    韩涛博客的域名更换为www.hantaosec.com啦,请更新一下域名哈,谢谢。我还会继续链着咱们...

首页|JavaScript|HTML|HTML4|HTML5|CSS3|开发工具|性能优化|移动开发|前端教程|性能优化|开发工具|酷站欣赏|UI设计|前端教程

Copyright © 2021 Web前端之家(www.jiangweishan.com) 版权所有 All Rights Reserved.
粤ICP备12067512号-1

Copyright Your WebSite.Some Rights Reserved.

Powered By Z-BlogPHP 1.6.8 Valyria