DOM节点的获取及创建

DOM节点的获取

通过id获取节点·【返回具体某个节点】

 document.getElementById(ID名)

通过标签名获取节点【返回节点数组，即使只有一个】

document.getElementsByTagName(标签名)

通过标签的name值获取节点【返回节点数组】

document.getElementsByName (Name名)通过class值来获取节点【返回节点数组】

通过class值获取节点【返回节点数组】

document.getElementsByClassName(Class名)

根据选择器返回找到结果集中的第一个

document.querySelect("选择器")

根据选择器返回找到的结果集，是个节点数组

document.querySelectAll("选择器")

创建DOM节点

创建元素节点

document.createElement('标签名’)

创建文本节点

document.createTextNode('文本内容')

创建属性节点

document.createAttribute('属性名')

为属性设置值

属性节点名.value ="属性值"

关联以上三个节点

元素节点名.appendChild(文本节点名);       //在元素节点上添加文本节点
元素节点名.setAttributeNode(属性节点名);   //在元素节点上添加属性节点
document.body.appendChild(元素节点名);   //将创建的节点添加到文档中

简洁写法:

var oDiv = document.createElement('div');  //创建元素节点
oDiv.setAttribute('class','wrapper box');  //为元素节点添加属性及属性值
oDiv.innerHTML ='创建DOM元素的简洁写法';      //为元素节点设置文本内容document.body.appendChild(oDiv);            /将创建的元素节点添加到文档中