JS节点的属性及方法

前言

学习了jquery等类库，可不能”忘本“，原生js才是它的根基。
”但是前端技术发展到今天，如果你时常关注Github上一些流行的开源JS项目，你会发现这样一种趋势：开发者们越来越倾向于使用原生代码，而不依赖与第三方库。“

---

一、属性

Attributes   存储节点的属性列表（只读）childNodes   存储节点的子节点列表（只读）dataType     返回次节点的数据类型documentElement  返回文档的根元素（可读写）firstChild   返回当前节点的第一个子节点（只读）lastChild    返回当前节点最后一个子节点（只读）nextSibling  返回当前节点的下一个兄弟节点（只读）nodeName     返回节点的名字（只读）nodeType     返回节点的类型（只读）（9代表Document节点、1代表Element节点、3代表Text节点、8代表Comment节点、11代表DocumentFragment节点）nodeValue    返回节点的文本（可读写）ownerDocument 返回包含此节点的根文档（只读）parentNode   返回父节点（只读）previousSibling  返回此节点的前一个兄弟节点（只读）Text         返回此节点及其后代的文本内容firstElementChild 返回第一个Element节点lastElementChild  返回最后一个Element节点nextElementSibling  返回下一个兄弟Element节点previousElementSibling 返回上一个兄弟Element节点childElementCount  子元素的数量

二、方法

appendChild   为当前节点添加一个新的子节点，放在最后的子节点cloneNode     返回当前节点的拷贝createAttribute  创建新的属性createComment 创建一个注释节点createDocumentFragment  创建DocumentFragment对象createElement 创建一个元素节点createNode    创建给定类型，名字和命名空间的节点createTextNode  创建包含给定数据的文本节点getElementsByTagName  返回指定名字的元素集合getElementById  返回指定ID的元素节点getElementsByName  返回给定name属性的元素集合hasChildNodes  返回当前节点是否又子节点insertBefore  在指定节点前插入子节点removeChild   从子节点列表中删除指定的子节点replaceChild  从子节点列表中替换指定的子节点save          把XML文件存到指定节点selectNodes   对节点进行指定的匹配，并返回第一个匹配的节点selectSingleNode  对节点进行指定的匹配，并返回第一个匹配节点insertAdjacentHTML  

三、节点引用

3.1 绝对引用

document.documentElement   返回文档的根节点document.activeElement     返回当前文档中被激活的标签节点event.fromElement          返回鼠标移出的源节点event.toElement            返回鼠标移入的源节点event.srcElement           返回激活事件的源节点document.forms  返回form元素

3.2 相对引用（node为当前节点）

返回父节点node.parentNodenode.parentElement返回子节点集合（包括文本节点以及标签节点）node.childNodes返回子标签节点集合node.children返回第一个子节点node.firstChild返回下一个兄弟节点node.nextSibling返回上一个兄弟节点node.previousSibling

3.3节点操作

创建新节点document.createElement(newNode)添加子节点node.appendChild(newNode)插入节点node.insertBefore(parentNode)删除节点node.remove()node.removeChild()node.removeNode()替换节点node.replaceChild()node.replaceNode()node.swapNode()复制节点node.cloneNode(boolean)  boolean:true/false 是否克隆该节点所有子节点node.contains(oNode)  是否包含某节点node.hasChildNodes()  是否有子节点

四、其他

getAttribute 获取属性  setAttribute 设置属性hasAttribute 检测命名属性是否存在  removeAttribute 删除属性