我需要找到下一个不是兄弟姐妹的元素

Question

假设我有以下HTML：

<span>
    <span id="x1" class="x">X1</span>
</span>
<span>
    <span>
        <span id="x2" class="x">X2</span>
    </span>
</span>

而$(this)是<span id="x1" ...>。

使用jQuery查找匹配.x的下一个元素的最佳方法是什么？ 实际文档的结构是不可预测的，因此提供的HTML只是一个例子。

我不能使用nextAll，因为它只找到兄弟姐妹。 如果我$('.x')，它会找到所有，但我必须迭代/比较。 有更好的解决方案吗？

另请参阅：http://jsfiddle.net/JZ9VW/1/。

Answer 1

鉴于您似乎不愿意对标记的结构做出假设，基于类的选择器是最好的。如果没有添加/删除元素，那么您可以选择它们一次并将其作为优化保留。

var exes = $('.x');
var x1 = $('#x1');
var nextEx = exes.eq(exes.index(x1) + 1);

http://jsfiddle.net/mattball/QKawu

使用真正的不可预测的HTML结构，要求“下一个元素”只在“具有指定类名的元素集合”的上下文中才有意义，这正是上面的代码反映。

Answer 2

找到父母，然后获取父母的下一个兄弟，然后找到该课程。

.parent().next().find('.x')