一、开解：

本文主要讲父子兄节点的简单用法，至于怎么取得节点，可以参考文[0301]和[0302]，视情况而定，有时候我们分别会用到父节点、子节点、或是兄节点，这里我简单列举一下。

var mchs = mdh.childNodes;//返回全部子节点

var mph = mdh.parentNode;//返回父节点

var mns = mdh.nextSibling;//返回下一个兄弟节点

var mps = mdh.previousSibling;//返回上一个兄弟节点

var mfc = mdh.firstChild;//返回第一个子节点

var mlc = mdh.lastChild;//返回最后一个子节点

注解:childNodes要当成数组来单个用，因为它是一个集合。

二、实例：

<body>

<div class="dh">

<div class="dh1">我是盒子1</div>

<div class="dh2">我是盒子2</div>

<div class="dh3">

<div class="dhx1">我是小盒子1</div>

<div class="dhx2">我是小盒子2</div>

</div>

<div class="dh4"></div>

</div>

</body>

<script>

var mdh = document.querySelector('.dh3');

var mchs = mdh.childNodes;//返回全部子节点(dhx1,dhx2)

var mph = mdh.parentNode;//返回父节点(dh)

var mns = mdh.nextSibling;//返回下一个兄弟节点(dh4)

var mps = mdh.previousSibling;//返回上一个兄弟节点(dh2)

var mfc = mdh.firstChild;//返回第一个子节点(dhx1)

var mlc = mdh.lastChild;//返回最后一个子节点(dhx2)

</script>

注解：这是一个简单的盒子结构，在后面的小括号里就是返回节点的class名。

三、总结：

在已知某节点元素的情况下，我们可以取得它的子节点，父节点，兄节点元素，当然对于节点元素，还有很多操作方法，我们后面会学习到的。
---------------------
作者：my128
来源：CSDN
原文：blog.csdn.net/MY128/artic…
版权声明：本文为博主原创文章，转载请附上博文链接！

Javacript中父节点、子节点、兄节点的简单用法