JS中的DOM节点

var list = document.querySelector('ul')

获取子节点(children)

console.log(list.children);//[li, li, li, li, li, li]

父节点.children会拿到一个所有子节点的数组,具体用哪个直接用数组的方法获取父节点.children[1]

   console.log( list.firstElementChild);//获取第一个子节点
    console.log( list.lastElementChild);//获取最后一个子节点

获取的是当前元素的直接父元素。parentNode是w3c的标准。

  
    111
    231
    123
    421
  
  console.log(span.parentNode);

parentElement和parentNode获取的东西是一样的，只是parentElement是ie的标准。


    111
  

  console.log(span.parentElement);

通过获取父亲节点再获取子节点来获取兄弟节点

var a =span.parentElement.children[1]

previousElementSibling就是单纯的获取元素的节点,区别是previousSibling会匹配字符，包括换行和空格，而不是节点

 console.log(span.previousElementSibling);//231
 console.log(span.previousSibling);//#text

同previousSibling和previousElementSibling，nextSibling和nextElementSibling也是类似的。

 console.log(span.nextElementSibling);//123
    console.log(span.nextSibling);//#text