JS学习笔记：DOM获取子节点，兄弟或兄弟元素节点，追加，删除，替换节点【诗书画唱】

DOM分为三次课:

1.基本的DOM结构(核心操作节点)

2.获取节点，获取节点的4种方式(id,class,name,tagname)

3.创建节点:元素节点、文本节点、属性节点

id:根据标签的id属性，最简单最直接的方式:只获取一个

Class:根据标签的class属性，可以给多个标签设置，得到一个数组

name:根据标签的name属性，得到的也是一个数组

tagname:根据标签名称，得到的也是数组

节点的分类:

（要能区分）元素节点，属性节点，文本节点。

nodeType(节点的分类):

1代表元素节点   2代表属性节点   3代表文本节点

nodeName(节点的名称):

元素节点(大写的标签名)，

属性节点(小写的属性名)

文本节点:#text

nodeValue(节点的值):

元素节点null

属性节点（小写的属性值）

文本节点(具体的内容)

获取子节点

获取所有的子节点(childNodes)

获取所有的元素节点(children)

获取某节点下第一个子节点(firstChild):包含文本节点

不包含文本节点(firstElementChild):不包含文本节点

最后一个子节点(lastChild)：包含文本节点

最后一个元素节点(lastElementChild)：最后一个元素节点

获取父节点(parentNode)

兄弟节点:

上一个:previousSibling

下一个:nextSibling

兄弟元素节点:

上一个:previousElementSibling

下一个:nextElementSibling

创建节点:元素节点、文本节点、属性节点

创建元素节点:createElement(“节点名称”)

创建文本节点:createTextNode("文本的内容")

属性节点:标签名.setAttribute("属性键","属性值")

追加节点:

b.appendChild(a):追加节点到最后一个节点后

insertBefor(a,b):追加节点a到b的前方

删除节点:

removeChild(a)：删除节点a

替换节点:

replaceChild(a,b)a去替换b