JavaScript进阶笔记——节点，节点属性，父节点、子节点、兄弟节点，创建节点，添加节点，删除节点，复制节点

节点

HTML DOM树中的所有节点均可以通过JavaScript来进行访问

一般来说，节点都有三个基本属性：

1. nodeType
2. nodeName
3. nodeValue

nodeType :

• 元素节点为1
• 属性节点为2
• 文本节点为3（文字、空格、换行等等）

一般操作的都是元素节点

父节点：

node . parentNode

子节点：

node . childNodes  返回的是子节点，可能是元素节点也可能是文本和属性节点，因此一般不用

node . children  返回子元素节点

node . firstChild  返回的是第一个子节点

node . lastChild   返回的是最后一个子节点

node . firstElementChild  返回的是第一个元素子节点

node . lastElementChild  返回的是最后一个元素子节点

（这俩有兼容性问题，IE9以上才支持）可以用children[0]等形式代替

兄弟节点：

node . nextSibling  返回下一个兄弟节点

node . nextElementSibling  返回下一个兄弟元素节点

node . previousSibling  返回上一个兄弟节点

node . previousElementSibling   返回上一个兄弟元素节点

创建节点：

document . createElement('节点名')

添加节点：

node . appendChild(节点变量)  追加到子节点的最后

node . insertChild(child,指定元素)  将一个节点添加到父节点的指定元素的前面

删除节点：

node . removeChild(child)    删除一个子节点，返回被删除的节点

复制节点：

node . cloneNode()   返回调用该方法的节点的一个副本

如果括号参数为空或false，则是浅度拷贝，只复制节点本身，不复制里面的内容

如果参数为true，那么是深度拷贝，会复制节点本身以及里面所有子节点