js节点

一：DOM:可以将html文档描述为一个有多层节点构成的结构；
每个节点都拥有自己的特点/数据/方法，并且与其他节点存在着微妙的关系；
节点分类：
1.元素节点：（div，span………）;
2.特性节点：（html属性），属性节点（a href）;
3.文本节点：（input）（换行。空格）；
4.注释节点（/&&&/）；
5.文档类型节点（！doctype）；
文档节点是每个文档的根节点，html元素是文档节点的子节点，称为文档元素；
每个文档只能有一个文档元素，在html文档中文档元素始终是html元素；
二：节点的常用方法和属性
1.创建节点（创建dom对象）

var DOM=document.createElement('元素名')；
console.log(DOM)

2.创建文本节点

var Dom_txt=document.createTextNode('文本')；

3.删除节点

父节点.removeChild(子节点)---需要删除的子节点；

4.替换节点

父节点.replaceChild(新节点，原节点)；

5.克隆节点

节点.cloneNode(true/false);
true:克隆当前节点/属性/子元素；
false：只能克隆当前节点/属性

6.添加属性

父节点.appendChild(子节点)；添加到父节点里面的后面；
父节点.inserBefore(新节点，原节点)；将新节点添加到原节点的前面

7.查找节点

父节点.firstChild:找到第一个子节点----文本节点（换行。空格都是文本节点）；
父节点.lastChild:找到最后一个子节点-------文本节点；
父节点.childNodes:找到所有的子节点----所有子节点包括文本节点；
父节点.children,找到所有的子节点-------所有元素的子节点；

8.获取节点类型

节点.nodeType--------返回当前的节点类型
返回的是1.是元素节点
       2.属性节点
       3.文本节点

9.获取节点名称

节点.nodeName-------返回的是当前节点的名称；

10.获取相邻节点

节点.previousSibling------返回的是当前节点的前一个兄弟；
节点.nextSibling-------返回的是当前节点的后一个兄弟；

11.获取父节点

节点.parentNode --------返回的是当前节点的父节点

12.获取属性值

节点.getAttribute('属性名')----返回当前节点属性名的属性值

13.设置属性值

节点.setArribute('属性名','属性值')

14.类名
获取：节点.className;获取当前节点的类名；
设置：节点.className=”类名”；设置当前节点的类名；

---

添加内容的方式：
1.通过innerHTML字符串拼接；
2.通过操作节点的方式实现；