在JavaScript中，获取兄弟节点是一种常见的操作，它可以使我们更加灵活地操作DOM树中的元素，实现自己需要的目的。比如，我们可能需要获取某个元素的前面或后面的兄弟元素，或者获取一组兄弟元素中的某个特定元素。本文将为大家介绍如何使用JavaScript获取兄弟节点，并且会带有具体的代码示例。

获取下一个兄弟节点

使用nextSibling属性可以获取当前元素的下一个兄弟节点。但是，可能会遇到一些问题，比如文本节点就会成为一种不希望获取的下一个兄弟节点，因此我们需要用到nextElementSibling属性。下面是一个例子，可以在控制台中尝试输出li元素的下一个兄弟节点：

var li = document.querySelector("li");
var nextLi = li.nextElementSibling;
console.log(nextLi);

上面的例子中，我们首先使用querySelector方法获取了文档中的第一个li元素，然后使用nextElementSibling属性获取了它的下一个兄弟节点。如果li元素的下一个兄弟节点是一个div元素，那么在控制台中就会输出一个div元素。

获取上一个兄弟节点

使用previousSibling属性可以获取当前元素的上一个兄弟节点。和获取下一个兄弟节点一样，使用前面提到的nextElementSibling属性会更加方便。下面是一个例子，可以在控制台中尝试输出li元素的上一个兄弟节点：

var li = document.querySelector("li");
var prevLi = li.previousElementSibling;
console.log(prevLi);

上面的例子中，我们使用querySelector方法获取了文档中的第一个li元素，然后使用previousElementSibling属性获取了它的上一个兄弟节点。如果li元素的上一个兄弟节点是一个div元素，那么在控制台中就会输出一个div元素。

获取所有兄弟节点

如果需要获取全部的兄弟节点，可以使用父元素的children属性并进行遍历。下面是一个例子，可以在控制台中尝试输出li元素的全部兄弟节点：

var li = document.querySelector("li");
var siblings = [];
var parent = li.parentNode;
var children = parent.children;
for(var i = 0; i< children.length; i++) {
if(children[i] !== li) {
siblings.push(children[i]);
}
}
console.log(siblings);

上面的例子中，我们首先使用querySelector方法获取了文档中的第一个li元素，然后通过parentNode属性获取了它的父元素ul。父元素的children属性可以返回一个该元素的所有子元素列表，在遍历子元素列表时，判断如果当前元素不是li元素，就将其添加到一个siblings数组中。最后，我们在控制台中输出数组，就可以看到所有的li元素除了自身以外的兄弟元素了。

获取特定类型的兄弟节点

如果需要获取特定类型的兄弟节点，可以使用第三方库或原生JavaScript方法。比较好用的方法是使用Array.prototype.filter方法，该方法可以创建一个新的数组，其中包含原数组中通过测试（函数内判断）的所有元素。下面是一个例子，可以在控制台中尝试输出li元素的所有下一个同级div元素：

var li = document.querySelector("li");
var divs = Array.prototype.filter.call(li.parentNode.children, function(elem){
return elem.tagName === "DIV";
});
console.log(divs);

上面的例子中，我们首先使用querySelector方法获取了文档中的第一个li元素，然后通过parentNode属性获取了它的父元素ul。父元素的children属性可以返回一个该元素的所有子元素列表，使用Array.prototype.filter方法可以筛选出所有下一个同级div元素。最后，在控制台中输出数组，就可以看到所有满足条件的元素了。

总结

通过获取兄弟节点，JavaScript可以实现更加灵活的DOM操作，完成自己需要的功能。对于开发者来说，了解如何获取兄弟节点是很有必要的。在本文中，我们介绍了获取下一个兄弟节点，获取上一个兄弟节点，获取所有兄弟节点和获取特定类型的兄弟节点的方法，并且提供了相应的代码示例。