在前端开发中，经常需要遍历DOM树来查找特定的元素。而当需要查找下一个非兄弟元素时，jQuery提供了一种方便的方法。
问题描述
我们假设有以下HTML结构：
---- ---------------- ---- ----------------------- ------- ---- ----------------------- ------- ------------ -------------- ---- ----------------------- ------- ---- ----------------------- ------- ------
现在我们想通过jQuery查找到<span>元素后面第一个不是兄弟元素的元素，也就是<div class="sibling">Sibling 3</div>。
解决方案
jQuery提供了nextAll()方法，可以返回当前元素后面所有的兄弟元素。但是如果要查找下一个非兄弟元素，我们需要额外的步骤。
我们可以使用链式调用的方式，先调用nextAll()方法获取所有的后续兄弟元素，然后再使用not()方法过滤掉所有与目标元素相邻的兄弟元素，最后使用first()方法获取剩余元素中的第一个元素即可。
下面是示例代码：
----- ------ - ---------- ----- ----------- - ----------------------------------------- -------------------------------- -- ------- -------- --
在上面的代码中，我们首先使用$('span')选中了目标元素，然后通过nextAll()方法获取所有的后续兄弟元素。接着，我们使用not('.sibling')过滤掉所有与目标元素相邻的兄弟元素，最后使用first()方法获取剩余元素中的第一个元素。
总结
通过本文，我们学习了如何使用jQuery查找下一个非兄弟元素。虽然这个问题看似简单，但是在实际开发中经常会遇到。希望本文能够对大家有所帮助。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/27459