152: 获取DOM元素(中)

补充: 什么是节点(node)? 节点由标签(元素),文本,属性组成, DOM对象(document)以树的形式保存界面上的内容, HTML页面的每一部分都是由节点组成; 看图: (图片转载自:http://www.w3school.com.cn/htmldom/index.asp)

HTML DOM 树

1. 获取指定元素的所有子元素: 

        children属性获取到的是指定元素的所有子元素; 

        childNodes属性获取的的是指定元素的所有节点; 

例子: var a = document.querySelector(".father");

var b = a.children, c = a.childNodes;

console.log(b); 

console.log(c); 

for (let nodeof a.children) {

console.log(node.nodeType,node);

}

for (let nodeof a.childNodes) {

// console.log(node.nodeType,node);

// if (1 === node.nodeType) {

    if (node.nodeType === Node.ELEMENT_NODE    ) {

console.log(node);

    }

}

补充: 只读属性 Node.nodeType 表示的是该节点的类型。nodeType 属性可用来区分不同类型的节点，比如 元素, 文本 和注释。var type=node.nodeType; 返回一个整数，其代表的是节点类型。其所有可能的值请参考 节点类型常量. 看图: (图片内容转在自: https://developer.mozilla.org/zh-CN/docs/Web/API/Node/nodeType)

节点类型常量表