childNodes:该属性获取当前节点包含所有子节点
//代码示例:
var box = document.getElementById("box")
var arr = getNodes(box);
console.log(arr);
//定义函数返回格式化后的节点
function getNodes(dom){
var arrNode = [];
var domChildNodes = dom.childNodes;
for (var i = 0; i < domChildNodes.length;i++) {
if(domChildNodes[i].nodeType === 3){
var reg = /^\s+$/;
if(!reg.test(domChildNodes[i].data)){
arrNode.push(domChildNodes[i].data);
}
}else{
arrNode.push(domChildNodes[i]);
}
}
return arrNode;
}
属性详解:
node.firstChild;获取第一个子元素
node.lastChild;获取最后一个子元素
node.parentNode;获取父元素
node.childNodes[i];获取某个子节点
node.nextSibling;获取下一个兄弟节点
node.previousSibling;获取上一个兄弟节点
node.nodeValue;元素null
node.nodeName;元素DIV 注释#content 文本#text 文档null
node.nodeType; 元素1 注释8 文本3 文档9