dom节点
什么是DOM及DOM操作？
什么是DOM及DOM操作？什么是 DOM ?DOM(⽂档对象模型)是针对于xml但是扩展⽤于html的应⽤程序编程接⼝，定义了访问和操作html的⽂档的标准。
W3C⽂档对象模型是中⽴于平台和语⾔之间的接⼝，它允许程序和脚本动态的访问和更新⽂档的内容、结构、样式。
总之HTML是关于如何获取、修改、添加和删除HTML元素的标准。
DOM 分层节点DOM的分层节点⼀般被称作是DOM树，树中的所有节点都可以通过脚本语⾔例如js进⾏访问，所有HTMlL元素节点都可以被创建、添加或者删除。
在DOM分层节点中，页⾯就是⽤分层节点图表⽰的。
整个⽂档是⼀个⽂档节点，就想是树的根⼀样。
每个HTML元素都是元素节点。
HTML元素内的⽂本就是⽂本节点。
每个HTML属性时属性节点。
当咱们访问⼀个web页⾯时，浏览器会解析每个HTML元素，创建了HTML⽂档的虚拟结构，并将其保存在内存中。
接着，HTML页⾯被转换成树状结构，每个HTML元素成为⼀个叶⼦节点，连接到⽗分⽀。
考虑以下 Html 结构：<!DOCTYPE html><html lang="en"><head><title>A super simple title!</title></head><body><h1>A super simple web page!</h1></body></html>在这个结构的顶部有⼀个document，也称为根元素，它包含另⼀个元素：html。
html元素包含⼀个head，⽽ head ⼜有⼀个title。
然后body 包含⼀个h1。
每个HTML元素都由特定类型（也称为接⼝）表⽰，并且可能包含⽂本或其他嵌套元素：document (HTMLDocument)|| --> html (HTMLHtmlElement)|| --> head (HtmlHeadElement)| || | --> title (HtmlTitleElement)| | --> text: "A super simple title!"|| --> body (HtmlBodyElement)| || | --> h1 (HTMLHeadingElement)| | --> text: "A super simple web page!"每个HTML元素都来⾃Element，但其中很⼤⼀部分都是专⽤的。
dom结构类型 -回复
dom结构类型-回复DOM结构类型简介及应用领域[DOM结构类型]是指文档对象模型（Document Object Model）中的三种基本节点类型：元素节点、文本节点和属性节点。
DOM是一种用于表示和处理网页文档的API，它将整个页面以一棵树的形式进行组织和访问，开发人员可以通过DOM接口来操作和修改页面的内容和样式。
DOM结构类型的应用非常广泛，以下将逐步介绍并深入讨论这三种节点类型的具体特点和应用领域。
第一步：元素节点元素节点是DOM树中的核心节点类型，代表HTML或XML文档中的各个标签。
每个网页都是由一个或多个元素节点组成的。
元素节点具有以下特点：1. 标签名：元素节点的名称由HTML或XML中的标签名决定，例如`<div>`、`<p>`、`<img>`等。
2. 属性：元素节点可以拥有零到多个属性，属性用于定义元素的额外信息，例如`<img src="image.jpg" alt="image">`中的`src`和`alt`就是该元素节点的属性。
3. 子节点：元素节点可以包含零到多个子节点，这些子节点可以是元素节点、文本节点或其他类型的节点。
元素节点广泛应用于网页开发中，通过操作元素节点，可以实现许多功能，例如：- 动态添加、删除或修改网页的各个元素，改变页面的结构和布局。
- 获取元素节点的属性值，例如修改或获取表单元素的值。
- 通过元素节点进行事件绑定，实现交互效果，例如点击一个按钮时触发某个事件。
第二步：文本节点文本节点是DOM树中的叶子节点，代表HTML或XML文档中的文本内容。
文本节点具有以下特点：1. 文本内容：文本节点的内容就是HTML或XML文档中的文本信息，例如`<p>Hello World</p>`中的`Hello World`就是该文本节点的内容。
2. 父节点：文本节点总是作为元素节点的子节点存在，没有直接包含其他节点。
12-DOM节点操作
替换节点
<div id="div1"> <p id="p1">这是一个段落</p> <p id="p2">这是另一个段落</p> </div> <script> var para=document.createElement("p"); var node=document.createTextNode("这是新段落。"); para.appendChild(node); var element=document.getElementById("div1"); element.replaceChild(para,oldChild); </script>
Javascript DOM节点操作
HTML5课程 版本V2.0
课程概要
1. HTML DOM节点 2. 节点之间的层次关系 3. 节点的添加、替换、删除 4. DOM节点信息 5. DOM节点属性
HTML DOM 节点
在 HTML DOM 中，所有事物都是节点。DOM 是被视为节点树的 HTML。 DOM 节点（Node） Node(节点)是DOM层次结构中的任何类型的对象的通用名称，Node有很多类型，如元素节点，属性节点，文本节点， 注释节点等 根据 W3C 的 HTML DOM 标准，HTML 文档中的所有内容都是节点： 1. 整个文档是一个文档节点(document) 2. 每个 HTML 元素是元素节点 3. HTML 元素内的文本是文本节点 4. 每个 HTML 属性是属性节点 5. 注释是注释节点 注 意： 1. 我们以前所讲的DOM节点其实是HTML DOM节点最常用的一块： HTML元素节点（也称Element对象,从属于Node 对象，都属于DOM对象）。 2. 本节内容能够提供更多的API(编程接口中的属性和方法)，更灵活的操控页面效果。
DOM获取节点的三种常用方法
Dom对象的常用方法：(1)getElementById() 查询给定ID属性值的元素，返回该元素的元素节点1、查询给定ID属性值的元素，返回该元素的元素节点。
也称为元素对象。
2、因为在一个html页面中id的值是唯一的，所以返回值也是唯一的。
所以方法的名称为getElementById()而不是getElementsById()3、该方法只能用于document对象，类似与java的static关键字。
(2)getElementsByName()查找给定name属性的所有元素，这个方法将返回一个节点集合，也可以称为对象集合1、查找给定name属性的所有元素，这个方法将返回一个节点集合，也可以称为对象集合。
2、这个集合可以作为数组来对待，length属性的值表示集合的个数。
3、因为在html页面中，name不能唯一确定一个元素，所以方法的名称为getElementsByName而不是getElementByName(3)getElementsByTagName()查询给定标签名的所有元素1、查询给定标签名的所有元素2、因为在html页面中，标签名不是唯一的，所以返回值为节点的集合。
3、这个集合可以当做数组来处理,length属性为集合里所有元素的个数4、可以有两种形式来执行这个方法：1、var elements =document.getElementsByTagName(tagName);2、var elements = element.getElementsByTagName(tagName);5、从这两种方法可以看出持有这个方法的对象并不一定是整个文档对象(document).也可以是某一个元素节点。
(4)hasChildNodes()该方法用来判断一个元素是否有子节点,返回值为true或者false1、该方法用来判断一个元素是否有子节点2、返回值为true或者false3、文本节点和属性节点不可能再包含子节点，所以对于这两类节点使用ChildNodes()方法返回值永远为false.4、如果hasChildNodes()返回值为false,则childNodes,firstChild,lastChild 将为空数组或者空字符串。
Dom节点操作常用方法
Dom节点操作常⽤⽅法1.访问/获取节点document.getElementById(id); //返回对拥有指定id的第⼀个对象进⾏访问document.getElementsByName(name); //返回带有指定名称的节点集合 注意拼写:Elementsdocument.getElementsByTagName(tagname); //返回带有指定标签名的对象集合 注意拼写：Elementsdocument.getElementsByClassName(classname); //返回带有指定class名称的对象集合注意拼写：Elements2.创建节点/属性document.createElement(eName); //创建⼀个节点document.createAttribute(attrName); //对某个节点创建属性document.createTextNode(text); //创建⽂本节点3.添加节点document.insertBefore(newNode,referenceNode); //在某个节点前插⼊节点parentNode.appendChild(newNode); //给某个节点添加⼦节点4.复制节点cloneNode(true | false); //复制某个节点参数：是否复制原节点的所有属性5.删除节点parentNode.removeChild(node); //删除某个节点的⼦节点 node是要删除的节点注意：为了保证兼容性，要判断元素节点的节点类型(nodeType)，若nodeType==1，再执⾏删除操作。
通过这个⽅法，就可以在 IE和Mozilla 完成正确的操作。
nodeType 属性可返回节点的类型.最重要的节点类型是：元素类型节点类型元素element1属性attr2⽂本text3注释comments8⽂档document96.修改⽂本节点⽅法作⽤appendData(data);将data加到⽂本节点后⾯deleteData(start,length);将从start处删除length个字符insertData(start,data);在start处插⼊字符,start的开始值是0;replaceData(start,length,data);在start处⽤data替换length个字符splitData(offset);在offset处分割⽂本节点substringData(start,length);从start处提取length个字符7.属性操作getAttribute(name) //通过属性名称获取某个节点属性的值setAttribute(name,value); //修改某个节点属性的值removeAttribute(name); //删除某个属性8.查找节点parentObj.firstChild; //如果节点为已知节点的第⼀个⼦节点就可以使⽤这个⽅法。
深入理解DOM节点类型第一篇——12种DOM节点类型概述
深⼊理解DOM节点类型第⼀篇——12种DOM节点类型概述前⾯的话 DOM是javascript操作⽹页的接⼝，全称为⽂档对象模型(Document Object Model)。
它的作⽤是将⽹页转为⼀个javascript对象，从⽽可以使⽤javascript对⽹页进⾏各种操作(⽐如增删内容)。
浏览器会根据DOM模型，将HTML⽂档解析成⼀系列的节点，再由这些节点组成⼀个树状结构。
DOM的最⼩组成单位叫做节点(node)，⽂档的树形结构(DOM树)由12种类型的节点组成。
本⽂将主要说明DOM节点类型总括 ⼀般地，节点⾄少拥有nodeType、nodeName和nodeValue这三个基本属性。
节点类型不同，这三个属性的值也不相同nodeType nodeType属性返回节点类型的常数值。
不同的类型对应不同的常数值，12种类型分别对应1到12的常数值元素节点 Node.ELEMENT_NODE(1)属性节点 Node.ATTRIBUTE_NODE(2)⽂本节点 Node.TEXT_NODE(3)CDATA节点 Node.CDATA_SECTION_NODE(4)实体引⽤名称节点 Node.ENTRY_REFERENCE_NODE(5)实体名称节点 Node.ENTITY_NODE(6)处理指令节点 Node.PROCESSING_INSTRUCTION_NODE(7)注释节点 MENT_NODE(8)⽂档节点 Node.DOCUMENT_NODE(9)⽂档类型节点 Node.DOCUMENT_TYPE_NODE(10)⽂档⽚段节点 Node.DOCUMENT_FRAGMENT_NODE(11)DTD声明节点 Node.NOTATION_NODE(12) DOM定义了⼀个Node接⼝，这个接⼝在javascript中是作为Node类型实现的，⽽在IE8-浏览器中的所有DOM对象都是以COM对象的形式实现的。
12种节点类型
12种节点类型DOM（文档对象模型）的12种节点类型包括：元素节点（ElementType）：元素节点对应网页的HTML标签元素，元素节点的节点类型值是1，节点名称值是大写的标签名。
属性节点（AttributeType）：属性节点表示元素的属性，节点类型值为2，节点名称值是属性的名称，nodeValue的值是属性对应的值。
文本节点（TextType）：文本节点表示元素的内容，节点类型值为3，节点名称值是null，nodeValue的值是文本内容。
注释节点（CommentType）：注释节点表示注释内容，节点类型值为8，节点名称值是null，nodeValue的值是注释内容。
文档节点（DocumentType）：文档节点表示HTML文档，也称为根节点，指向document对象。
文档片段节点（DocumentFragmentType）：文档片段节点表示文档片段，节点类型值为15，节点名称值是null，nodeValue的值是片段内容。
域节点（DomainType）：域节点表示域，节点类型值为16，节点名称值是域的名称，nodeValue的值是域的值。
属性节点（ProprietaryType）：属性节点表示专有属性，节点类型值为17，节点名称值是属性的名称，nodeValue的值是属性对应的值。
命名空间节点（NamespaceType）：命名空间节点表示命名空间，节点类型值为18，节点名称值是命名空间的名称，nodeValue的值是命名空间的URL。
CDATA节点（CharacterDataType）：CDATA节点表示字符数据，节点类型值为4，节点名称值是null，nodeValue的值是数据内容。
程序代码节点（ProcessingInstructionType）：程序代码节点表示处理指令，节点类型值为7，节点名称值是处理指令的名称，nodeValue 的值是处理指令的内容。
这种节点类型主要用于XML文档中，表示特定的程序指令。
DOM基础讲解
DOM基础学习要点：1.DOM 介绍2.查找元素3.DOM 节点4.节点操作DOM（Document Object Model）即文档对象模型，针对 HTML 和 XML 文档的 API（应用程序接口）。
DOM描绘了一个层次化的节点树，运行开发人员添加、移除和修改页面的某一部分。
DOM脱胎于Netscape及微软公司创始的DHTML（动态HTML），但现在它已经成为表现和操作页面标记的真正跨平台、语言中立的方式。
一．DOM介绍DOM 中的三个字母，D（文档）可以理解为整个Web 加载的网页文档；O（对象）可以理解为类似window对象之类的东西，可以调用属性和方法，这里我们说的是document对象；M（模型）可以理解为网页文档的树型结构。
DOM 有三个等级，分别是 DOM1、DOM2、DOM3，并且 DOM1 在 1998 年 10 月成为 W3C 标准。
DOM1 所支持的浏览器包括 IE6+、Firefox、Safari、Chrome 和 Opera1.7+。
PS：IE 中的所有 DOM 对象都是以 COM 对象的形式实现的，这意味着 IE 中的 DOM 可能会和其他浏览器有一定的差异。
1.节点加载HTML页面时，Web浏览器生成一个树型结构，用来表示页面内部结构。
DOM将这种树型结构理解为由节点组成。
节点树从上图的树型结构，我们理解几个概念，html标签没有父辈，没有兄弟，所以html标签为根标签。
head标签是html子标签，meta和title标签之间是兄弟关系。
如果把每个标签当作一个节点的话，那么这些节点组合成了一棵节点树。
PS：后面我们经常把标签称作为元素，是一个意思。
2.节点种类：元素节点、文本节点、属性节点。
<div title="属性节点">测试 Div</div>二．查找元素W3C 提供了比较方便简单的定位节点的方法和属性，以便我们快速的对节点进行操作。
DOM节点的属性和方法
DOM节点的属性和⽅法DOMDOM 是 JavaScript 操作⽹页的接⼝，全称为“⽂档对象模型”（Document Object Model）。
它的作⽤是将⽹页转为⼀个 JavaScript 对象，从⽽可以⽤脚本进⾏各种操作（⽐如增删内容）。
它只是⼀个接⼝规范，可以⽤各种语⾔实现。
所以严格地说，DOM 不是 JavaScript 语法的⼀部分，但是 DOM 操作是 JavaScript 最常见的任务，离开了 DOM，JavaScript 就⽆法控制⽹页。
另⼀⽅⾯，JavaScript 也是最常⽤于 DOM 操作的语⾔。
节点DOM 的最⼩组成单位叫做节点（node）。
⽂档的树形结构（DOM 树），就是由各种不同类型的节点组成。
每个节点可以看作是⽂档树的⼀⽚叶⼦。
节点的类型有七种。
Document：整个⽂档树的顶层节点DocumentType：doctype标签（⽐如<!DOCTYPE html>）Element：⽹页的各种HTML标签（⽐如<body>、<a>等）Attribute：⽹页元素的属性（⽐如class="right"）Text：标签之间或标签包含的⽂本Comment：注释DocumentFragment：⽂档的⽚段浏览器提供⼀个原⽣的节点对象Node，上⾯这七种节点都继承了Node，因此具有⼀些共同的属性和⽅法。
节点树所有的节点就好像组成了⼀棵树，⽽document节点就代表整个树也就是整个⽂档。
⽂档的第⼀层有两个节点，第⼀个是⽂档类型节点（<!doctype html>），第⼆个是 HTML ⽹页的顶层容器标签<html>。
后者构成了树结构的根节点（root node），其他 HTML 标签节点都是它的下级节点。
除了根节点，其他节点都有三种层级关系。
⽗节点关系（parentNode）：直接的那个上级节点⼦节点关系（childNodes）：直接的下级节点同级节点关系（sibling）：拥有同⼀个⽗节点的节点DOM 提供操作接⼝，⽤来获取这三种关系的节点。
js操作dom节点的方法
js操作dom节点的方法JavaScript提供了许多操作DOM节点的方法，以下是一些常用的方法：1. `getElementById(id)`：根据指定的ID获取一个DOM节点。
2. `getElementsByClassName(className)`：根据指定的类名获取一个包含多个DOM节点的NodeList对象。
3. `getElementsByTagName(tagName)`：根据指定的标签名获取一个包含多个DOM节点的NodeList对象。
4. `querySelector(selector)`：根据指定的CSS选择器获取一个DOM节点。
5. `querySelectorAll(selector)`：根据指定的CSS选择器获取一个包含多个DOM节点的NodeList对象。
6. `appendChild(node)`：将指定的节点添加到当前节点的子节点列表末尾。
7. `insertBefore(node, referenceNode)`：在指定参考节点之前插入指定的节点。
8. `removeChild(node)`：从当前节点中删除指定的子节点。
9. `replaceChild(newNode, oldNode)`：将指定旧节点替换为新节点。
10. `setAttribute(name, value)`：设置指定节点的属性值。
11. `removeAttribute(name)`：删除指定节点的属性。
12. `textContent`：获取或设置指定节点的文本内容。
13. `innerHTML`：获取或设置指定节点的HTML内容。
14. `classList`：用于添加、删除、切换和检查元素的类名。
这些方法可以帮助您在JavaScript中操作DOM节点，以实现动态更改网页内容、样式和结构的目的。
dom结构类型
dom结构类型DOM（文档对象模型）是一种用于表示和操作文档的树状结构的编程接口。
DOM 不是一种具体的编程语言，而是一种描述文档结构的标准。
它提供了一种将文档表示为树形结构的方式，其中每个节点都代表文档中的一个部分，如元素、属性、文本等。
在 DOM 结构中，常见的节点类型包括：1. 元素节点（Element Node）：表示 HTML 或 XML 文档中的元素，如 <div>、<p>、<a> 等。
元素节点可以有子节点，如其他元素、文本或属性。
2. 文本节点（Text Node）：表示元素中的文本内容。
文本节点是元素节点的子节点，包含在开始和结束标签之间。
3. 属性节点（Attribute Node）：表示元素的属性。
属性节点包含在元素节点内，描述了元素的特性。
4. 注释节点（Comment Node）：表示注释内容。
注释节点是一种特殊的文本节点，以 <!-- 开始，以 --> 结束。
5. 文档节点（Document Node）：表示整个文档。
文档节点是DOM 树的根节点，包含文档的所有内容。
6. 文档类型节点（Document Type Node）：表示文档的类型声明。
这通常出现在文档的开头，使用 <!DOCTYPE>。
在使用 JavaScript 操作 DOM 时，可以通过 DOM API 提供的方法来访问和操作这些节点。
例如，使用 getElementById 方法可以获取指定ID 的元素节点，使用createTextNode 方法可以创建文本节点，等等。
通过这些方法，你可以动态地修改文档的内容和结构。
dom节点样式操作要点
dom节点样式操作要点DOM（文档对象模型）节点样式操作是指通过JavaScript来操作HTML元素的样式。
要点包括以下几个方面：1. 获取DOM节点，首先要获取要操作的DOM节点，可以通过document.getElementById、document.getElementsByClassName、document.getElementsByTagName等方法获取到对应的DOM节点。
2. 修改样式属性，一旦获取到DOM节点，就可以通过节点的style属性来修改其样式。
比如，可以通过style.color来修改文本颜色，通过style.backgroundColor来修改背景颜色，通过style.fontSize来修改字体大小等。
3. 添加和移除类名，通过classList属性可以添加和移除元素的类名，从而改变元素的样式。
可以使用add方法添加类名，remove方法移除类名，toggle方法切换类名的状态。
4. 计算样式，可以使用window.getComputedStyle方法来获取计算后的样式，这样可以获取到元素最终呈现的样式，而不仅仅是内联样式。
5. 使用CSSText属性，可以直接通过设置元素的style.cssText属性来一次性设置多个样式，这在一次性修改多个样式时很方便。
6. 注意兼容性，在进行DOM节点样式操作时，要注意不同浏览器对样式操作的兼容性。
有些属性在不同浏览器下的表现可能会有差异，需要进行兼容性处理。
总之，DOM节点样式操作是通过JavaScript来实现对HTML元素样式的动态修改，可以通过获取节点、修改样式属性、添加移除类名、计算样式等方式来实现对元素样式的操作。
在实际应用中，需要注意兼容性，并且可以结合CSS样式表来更好地管理和操作元素的样式。
DOM获取节点的三种常用方法
Dom对象的常用方法：(1)getElementById() 查询给定ID属性值的元素，返回该元素的元素节点1、查询给定ID属性值的元素，返回该元素的元素节点。
也称为元素对象。
2、因为在一个html页面中id的值是唯一的，所以返回值也是唯一的。
所以方法的名称为getElementById()而不是getElementsById()3、该方法只能用于document对象，类似与java的static关键字。
(2)getElementsByName()查找给定name属性的所有元素，这个方法将返回一个节点集合，也可以称为对象集合1、查找给定name属性的所有元素，这个方法将返回一个节点集合，也可以称为对象集合。
2、这个集合可以作为数组来对待，length属性的值表示集合的个数。
3、因为在html页面中，name不能唯一确定一个元素，所以方法的名称为getElementsByName而不是getElementByName(3)getElementsByTagName()查询给定标签名的所有元素1、查询给定标签名的所有元素2、因为在html页面中，标签名不是唯一的，所以返回值为节点的集合。
3、这个集合可以当做数组来处理,length属性为集合里所有元素的个数4、可以有两种形式来执行这个方法：1、var elements =document.getElementsByTagName(tagName);2、var elements = element.getElementsByTagName(tagName);5、从这两种方法可以看出持有这个方法的对象并不一定是整个文档对象(document).也可以是某一个元素节点。
(4)hasChildNodes()该方法用来判断一个元素是否有子节点,返回值为true或者false1、该方法用来判断一个元素是否有子节点2、返回值为true或者false3、文本节点和属性节点不可能再包含子节点，所以对于这两类节点使用ChildNodes()方法返回值永远为false.4、如果hasChildNodes()返回值为false,则childNodes,firstChild,lastChild 将为空数组或者空字符串。
DOM节点的选取
DOM节点的选取DOM提供了对HTML文档中元素、属性以及文本的一系列操作方法和属性。
通过对HTML节点的操作来实现相应的效果及交互。
节点分三类：元素节点、属性节点、文档节点，其中元素节点最为重要，后面两种节点依赖于元素节点。
元素节点的获取：旧的查找方案：document.body【可直接拿到body元素】document.forms【可拿到所有form表单】document.href 【可拿到所有带href属性的元素】方法：document.getElementByClassName(" ")document.getElementById(" ")document.getElementByTagName(" ")【返回伪数组】方法（ES6）：document.querySelector(" ")document.querySelectorAll(" ")通过元素之间的关系查找：element.parentElementelement.firstElementChildstElementChildelement.childrenelement.previousElementSiblingelement.nextElementSibling操作元素节点：创建、添加，删除，替换，克隆。
创建的节点并没有添加到HTML文档中，需要添加后才展现在HTML文档里。
element.cloneNode( )【（）里填写true为深克隆，会将克隆元素的标签内容一起复制，否则只复制标签】文本节点内容的获取：textNode.nodeValue【不常用】elementNode.innerText【获取元素下所有文本，只能修改文本，不能修改标签】elementNode.innerHTML【获取元素下所有节点（包括注释节点），能修改添加标签】属性节点的操作：elementNode.attributeName【for 属性需写成：htmlFor class属性需要写成：className】elementNode..attributes【获取某个元素下所有属性节点】操作方法：element.getAttribute(" ")【获取元素节点】element.setAttribute(" ")【设置】element.removeAttribute(" ")【删除】element.hasAttribute(" ")【是否存在】自定义属性：在HTML里为某些同级相同标签添加以data-开头的自定义属性，这样在dom里可以通过dataset属性即可操作元素节点来源：。
dom创建节点的方法
dom创建节点的方法
在DOM（Document Object Model）中，创建节点的方法主要有以下几种：
1. `createElement()`：此方法用于创建元素节点，接收一个字符串类型的参数，即要创建的元素的标签名。
2. `createTextNode()`：此方法用于创建文本节点，接收一个字符串类型的参数，即要创建的文本的内容。
3. `createAttribute()`：此方法用于创建属性节点，接收一个字符串类型的参数，即要创建的属性的名称。
4. `createComment()`：此方法用于创建注释节点，接收一个字符串类型的参数，即要创建的注释文本。
5. `createDocumentFragment()`：此方法用于创建一个虚拟的节点对象，或者说，是用来创建文档碎片节点。
它可以包含各种类型的节点，在创建之初是空的。
DocumentFragment节点不属于文档树，继承的parentNode 属性总是null。
这个特性使得DocumentFragment成了占位符，暂时存放那些一次插入文档的节点。
它还有利于实现文档的剪切、复制和粘贴操作。
以上是DOM中常用的创建节点的方法，它们都返回创建的节点对象，可以根据需要进行进一步的操作。
DOM里常见的三种节点类型
DOM⾥常见的三种节点类型1.nodeName⽐tagName注意⼆者返回的是⼤写!⼤写!⼤写!从DOM层次来看，nodeName是接⼝上的property，⽽tagName是接⼝上的property，所有的节点（元素节点，属性节点，⽂本节点等12种）都继承了node 接⼝，⽽只有元素节点才继承了element节点，因此nodeName⽐tagName具有更⼤的使⽤范围。
⼀般地，节点⾄少拥有nodeType、nodeName和nodeValue这三个基本属性。
总结：tagName只能⽤在元素节点上，⽽nodeName可以⽤在任何节点上，可以说nodeName涵盖了tagName，并且具有更多的功能，因此建议总是使⽤nodeName。
nodeTypenodeType属性返回节点类型的常数值。
不同的类型对应不同的常数值，12种类型分别对应1到12的常数值元素节点 Node.ELEMENT_NODE(1)属性节点 Node.ATTRIBUTE_NODE(2)⽂本节点 Node.TEXT_NODE(3)CDATA节点 Node.CDATA_SECTION_NODE(4)实体引⽤名称节点 Node.ENTRY_REFERENCE_NODE(5)实体名称节点 Node.ENTITY_NODE(6)处理指令节点 Node.PROCESSING_INSTRUCTION_NODE(7)注释节点 MENT_NODE(8)⽂档节点 Node.DOCUMENT_NODE(9)⽂档类型节点 Node.DOCUMENT_TYPE_NODE(10)⽂档⽚段节点 Node.DOCUMENT_FRAGMENT_NODE(11)DTD声明节点 Node.NOTATION_NODE(12)2.获得元素属性的集合：document.getElementsByTagName("BUTTON")[0].attributes;。
DOM获取节点的三种常用方法
DOM获取节点的三种常用方法在前端开发中，DOM（文档对象模型）是非常重要的一部分。
通过DOM，我们可以操作网页上的元素节点，实现动态的页面效果。
而获取节点则是在DOM中常见的操作之一、本文将介绍DOM获取节点的三种常用方法，分别是getElementById、getElementsByClassName和getElementsByTagName。
一、getElementById：getElementById是DOM中最简单，也是最常用的获取元素的方法。
它通过指定元素的id属性来获取对应的元素节点。
id属性在HTML文档中是唯一的，所以该方法可以准确定位到对应的元素。
getElementById的语法如下：```javascriptdocument.getElementById(id)```其中，id代表要获取的元素的id属性值。
如果找到对应id的元素，则返回该元素节点；如果找不到，则返回null。
例如，以下代码将会获取文档中id为"myElement"的元素节点：```javascriptvar myElement = document.getElementById("myElement");```二、getElementsByClassName：getElementsByClassName是通过元素的类名来获取元素的方法。
它会返回一个元素节点的集合，这些元素节点的类名与指定的类名相同。
getElementsByClassName的语法如下：```javascriptdocument.getElementsByClassName(className)```其中，className是要获取元素的类名。
可以指定一个或多个类名，多个类名之间用空格分隔。
这样，返回的集合中会包含具有这些类名中至少有一个的元素节点。
例如，以下代码将会获取文档中所有类名为"myClass"的元素节点：```javascriptvar elements = document.getElementsByClassName("myClass");```需要注意的是，getElementsByClassName是在HTML5中引入的方法，旧版本的浏览器可能不支持。
DOM获取节点的三种常用方法
DOM获取节点的三种常用方法DOM（Document Object Model）是一种标准的API，用于处理HTML 和XML文档的结构。
在前端开发中，经常需要通过DOM来获取和操作页面中的元素节点。
常见的DOM节点获取方法包括getElementById、getElementsByClassName和getElementsByTagName。
下面将详细介绍这三种方法以及它们的用法和注意事项。
1. getElementById方法getElementById方法接收一个参数，即要获取元素的id值，返回一个符合条件的元素节点，如果找不到则返回null。
该方法是获取页面上唯一元素的最有效的方法。
用法示例：```javascriptlet element = document.getElementById("myElement");```这个例子中，getElementById方法将返回id为"myElement"的元素节点，可以对它进行操作或者获取它的属性。
注意事项：- 通过getElementById获取的元素节点是一个对象，可以使用点操作符来访问和修改其属性。
- getElementById方法只能获取页面上的元素节点，不能获取文本节点或注释节点。
2. getElementsByClassName方法getElementsByClassName方法接收一个参数，即要获取元素的class 值，返回一个符合条件的元素节点的集合，如果找不到任何元素则返回一个空的HTMLCollection对象。
用法示例：```javascriptlet elements = document.getElementsByClassName("myClass");```这个例子中，getElementsByClassName方法将返回class为"myClass"的所有元素节点，可以通过遍历集合来访问这些节点。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
返回最后一个子节点。返回值同firstChild,三方待遇参考上面。有一个等价式:lห้องสมุดไป่ตู้stChide=childNodes[childNodes.length-1].
7 .nextSibling()
返回节点的下一个兄弟节点。如果没有下一个兄弟节点的话，返回null。只读属性，不可以更改应用。
4 .childNodes
返回子节点数组。文本和属性节点的childNodes永远是null。可以用hasChildNodes()来判断是否有子节点。只读属性，要删除添加节点可不能用操作childNodes数组的办法呃。
5 .firstChild
返回第一个子节点。文本和属性节点没有子节点，会返回一个空数组，这是针对这二位的特殊待遇。对于元素节点，若是没有子节点会返回null.有一个等价式：firstChild=childNodes[0].
7. 插入节点
insertBefor(newOp,targetOp);
insertAfter(newOp,targetOp);
8. 设置或得到属性节点
setAttribute('key','value');
getAttribute('key','value')
9.复制节点。
cloneNode(true/false)
操作：
1. 创建节点
createElement('tagName');
如：var oP=document.createElement('p');创建了一个<p></p>标签。
2. 创建文本节点
createTextNode('text');
如：var oText=document.createTextNode('This is a paragh!');
属性：
1 .nodeName
节点名称，相当于tagName.属性节点返回属性名，文本节点返回#text。nodeName，是只读的。
2 .nodeType
值：1，元素节点；2，属性节点；3，文本节点。nodeType是只读的。
3 .nodeValue
返回一个字符串，指示这个节点的值。元素节点返回null，属性节点返回属性值，文本节点返回文本。nodeValue可读可写，这是对元素节点不能写。一般只用于设置文本节点的值。
8 .previousSibling()
返回节点的上一个兄弟节点。同上。
9 .parentNode()
返回节点的父节点。document.parentNode()返回null，其他的情况下都将返回一个元素节点，因为只有元素节点拥有子节点，出了document外任何节点都拥有父节点。parentNode()，又是一个只读的家伙。
3. 附加子节点
appendChild(o);其中o为节点对象。
如：document.body.appendChildNode(o);在body末尾追加
document.forms[0].appendChildNode(o);在form表单末尾追加
oP.appendChildNode(o);在元素内部的末尾追加，其总oP为节点对象。
6. 替换节点
replaceChid(newOp,targetOp);将目标节点targetOp替换为newOp
如：document.body.replayChild(oPa,oPb).ps:怎会这样特殊?源和目地操作数都是参数，为何调用者是document.body？记住先，别多管。——被替换的必须是body的子节点，可以用其他element替代document.body,前提一样，被替换的要是这个element的子节点。
4. 创建文档片断
createDocumentFragment();
如：var oF=document.createDocumentFragment();
5. 删除节点
removeChild(oP);
如：document.body.removeChild(oP)，从body中移除oP节点对象。