原生JS操作DOM常用的属性和方法

①　获取所有子节点对象

 

childeNodes 

②　获取第一个子节点

 

firstChild   

③　获取最后一个子节点

 

lastChild    

④　获取父节点

 

parentNode  

⑤　获取下一个兄弟节点

 

nextSibling

⑥　获取前一个兄弟节点

 

previousSibling

⑦　获取节点的HTML标记名称（大写字母）

 

nodeName 

⑧　获取DOM元素：

 

document.getElementById("***");

document.getElementsByClassName("***")[0];

document.getElementsByTagName("***")[0];

document.getElementsByName("***")[0];

⑨　修改CSS样式

 

document.getElementById("***").style.***= "***";

⑩　修改CLASS属性

 

document.getElementById("***").className = "***";

document.getElementById("***").className = "";

⑪　修改文本

 

document.getElementById("***").innerHTML = "***";

⑫　创建、插入、删除、复制节点

 

document.createElement('div');

document.createTextNode('123');

***.appendChild(***);

***.parentNode.removeChild(***)

***.cloneNode(true)或***.cloneNode()

***父节点.insertBefore(***待插入节点, ***参考节点)

注意：原生JS没有insertAfter()方法。