DOM —【节点的关系】

子节点：

var oul=document.getElementsByTagName('ul')[0];
console.log(oul.childNodes);
console.log(oul.children);

childNodes：是获取父元素下的所有子元素（包括回车空格在内的#text文本）；

而children则是只会把父元素下的所有元素节点返回，并不会返回（回车#text等）

父节点：

var oul=document.getElementsByTagName('ul')[0];
console.log(oul.parentNode);

parentNode: 获取的是选中元素的父级元素（如果是最外层的元素，则他的父元素为body）

兄弟节点：

var oul=document.getElementsByTagName('ul')[0];
var oli=document.getElementsByTagName('li')[2];
console.log(oli.previousSibling);       //返回上一个同级的兄弟节点(包含空格#text)
console.log(oli.previousElementSibling);//返回上一个同级的元素节点
console.log(oli.nextSibling);           //返回下一个同级的兄弟节点(包含空格#text)
console.log(oli.nextElementSibling);    //返回下一个同级的元素节点
console.log(oul.firstChild);            //返回第一个子元素(包含空格#text）
console.log(oul.firstElementChild);     //返回第一个字元素节点
console.log(oul.lastChild);             //返回最后一个子元素(包含空格#text）
console.log(oul.lastElementChild);      //返回最后一个字元素节点