javascript中childNodes与children的区别

1、childNodes：获取节点，不同浏览器表现不同；
　　IE：只获取元素节点；
　　非IE：获取元素节点与文本节点；
　　解决方案：if(childNode.nodeName=="#text") continue 或者 if(childNode.nodeType != '3') continue 
2、children：获取元素节点，浏览器表现相同。
　　因此建议使用children。
3、firstChild与firstElementChild
　　相同点：获取父节点下的第一个节点对象；
　　不同点：1、firstchild：IE6,7,8：第一个元素节点；
   非IE6,7,8：第一个节点，文本节点或者元素节点；
　　　　　　2、firstElementChild：IE6,7,8：不支持；
  　　　　　　　　　　　　　　　　非IE6,7,8：第一个元素节点；

function firstChild(obj){
    if(obj.firstElementChild) return obj.firstElementChild;
    return obj.firstChild
}

4、lastChild与lastElementChild
　　相同点：获取父节点下的最后一个节点对象；
　　不同点：1、lastchild：IE6,7,8：最后一个元素节点；
　　　　　　　　　　　　  非IE6,7,8：最后一个节点，文本节点或者元素节点；
　　　　　　2、lastElementChild：IE6,7,8：不支持；
　　　　　　　　　　　　　　　　 非IE6,7,8：最后一个元素节点；
5、nextSibling与nextElementChild
　　相同点：获取后一个兄弟节点对象；
　　不同点：1、nextSibling：IE6,7,8：后一个兄弟元素节点；
　　　　　　　　　　　　    非IE6,7,8：后一个兄弟节点，文本节点或者元素节点；
　　　　　　2、lastElementChild：IE6,7,8：不支持；
　　　　　　　　　　　　　　　　 非IE6,7,8：后一个兄弟元素节点；
6、previousSibling与previousElementChild
　　相同点：获取前一个兄弟节点对象
　　不同点：1、previousSibling：IE6,7,8：前一个兄弟元素节点；
　　　　　　　　　　　　        非IE6,7,8：前一个兄弟节点，文本节点或者元素节点；
　　　　　　2、previousElementChild：IE6,7,8：不支持；
　　　　　　　　　　　　　　　　　   非IE6,7,8：前一个兄弟元素节点；
7、parentNode：获取父元素，不存在兼容性问题。
8、offsetParent：获取第一个设置定位的父元素；
   offsetLeft：获取离第一个定位父元素的左距离；

   offsetTop：获取离第一个定位父元素的上距离；

参考引用： https://www.cnblogs.com/ilovexiaoming/p/6853176.html