高级节点操作

高级选取： 第一个子节点， 最后一个子节点， 上一个兄弟节点， 下一个兄弟节点(包含空白和不包含空白等分成8个属性)

// var ul = document.body.children[0];

// console.log(ul);

firstChild: 第一个子节点(包含空白)

// console.log(ul.firstChild); //换行空白 #text

firstElementChild: 第一个子节点(不包含空白)

// console.log(ul.firstElementChild); //

lastChild: 最后一个子节点(包含空白)

// console.log(ul.lastChild); //换行空白 #text

lastElementChild: 最后一个子节点(不包含空白)

// console.log(ul.lastElementChild); //

previousSibling: 上一个兄弟节点(包含空白)

// console.log(ul.firstElementChild); //

// console.log(ul.firstElementChild.previousSibling); //空白节点，换行 #text

previousElementSibling: 上一个兄弟节点(不包含空白)

// console.log(ul.firstElementChild.previousElementSibling); //null

nextSibling: 下一个兄弟节点(包含空白)

// console.log(ul.firstElementChild.nextSibling); //空白节点，换行 #text

nextElementSibling: 下一个兄弟节点(不包含空白)

// console.log(ul.firstElementChild.nextElementSibling); //