JS获取子节点、父节点和兄弟节点id的方法

首先了解
parentNode,parentElement;
childNodes,children；
nextSibling，nextElementSibling
previousSibling, previousElementSibling
的区别之前，
必须对Dom树有一定的了解，在Dom文档结构中，HTML页面每一部分都是由节点组成的，节点的类型一共有3种，元素节点，文本节点，属性节点，从图中可以看出属性节点属于元素节点的分支，一般不常考虑。
nextSibling属性与nextElementSibling属性的差别：
nextSibling属性返回元素节点之后的兄弟节点（包括文本节点、注释节点即回车、换行、空格、文本等等）；
nextElementSibling属性只返回元素节点之后的兄弟元素节点（不包括文本节点、注释节点）；

注意: 空格、回车也会看作文本，以文本节点对待。
下例中，如果两个li元素之间有空格、回车，将返回 “undefined”。

childNodes与childern的差别
childNodes指的是返回当前元素子节点的所有类型节点，包括空格和换行符




parentNode与parentElement的区别
两者在通常情况下都是一样的，因为包含元素的节点只有可能是元素节点