获取节点对象的方法

    var oDiv = document.querySelector('div');

    1,获取当前标签中所有的子级节点
    执行结果,是一个伪数组,可以forEach()
    形式是与 querySelectorAll() 获取的伪数组是一样的
    console.log( oDiv.childNodes );

    2,获取当前标签中,所有的元素节点/标签节点
    执行结果,是一个伪数组,不能forEach()
    console.log( oDiv.children );

    3,获取当前标签中,第一个节点
    执行结果,是一个对象,内容形式与DOM操作方式,获取的内容是一样的
    console.dir( oDiv.firstChild );

    4,获取当前标签中,最后一个节点
    执行结果,是一个对象,内容形式与DOM操作方式,获取的内容是一样的
    console.dir( oDiv.lastChild );
    console.dir( document.querySelector('span') );

    5,获取当前标签中,第一个标签节点,其他节点不会获取
    console.log( oDiv.firstElementChild );

    6,获取当前标签中,最后一个标签节点,其他节点不会获取
    console.log( oDiv.lastElementChild );

    7,获取当前标签,上一个兄弟节点(找哥哥)
    如果没有执行结果是null
    console.log( oDiv.previousSibling );

    8,获取当前标签,下一个兄弟节点(找弟弟)
    如果没有执行结果是null
    console.log( oDiv.nextSibling );

    9,获取当前标签,上一个兄弟元素节点(找标签哥哥)
    console.log( oDiv.previousElementSibling );

    10,获取当前标签,下一个兄弟元素节点(找标签弟弟)
    console.log( oDiv.nextElementSibling );

    11,获取当前标签,父级节点
    只获取直接父级节点
    console.log( oDiv.parentNode );
    console.log( document.querySelector('span').parentNode );

    12,获取当前标签,所有属性节点
    执行结果,是一个伪数组,不能forEach()
    console.log( oDiv.attributes );

    总结
    1,通过节点操作获取的对象/伪数组与通过 DOM操作的对象/伪数组,形式上是一致的
      可以相互操作,DOM方法可以操作 节点对象
                  节点方法可以操作 DOM对象
    2,执行结果,伪数组/对象
      伪数组有的可以forEach, 有的不能forEach