nextUntil()在li中选择标题

Question

我正在尝试使用.nextUntil((.选择h2标签下的所有h3标签，即使是在li中，无论是页面中的ul还是ol

HTML标记类似于：

<h2></h2>
<h3></h3>
<h3></h3>
<h3></h3>
<h2></h2>
<h3></h3>
<h3></h3>
<h3></h3>
<h2></h2>
<ol>
<li>
<h3></h3>
</li>
<li>
<h3></h3>
</li>
<li>
<h3></h3>
</li>
</ol>

Js就像：

var h2s = $('h2').toArray();
var h3s = [];
for (i = 0, i < h2s.length, i++){
h3s.push($('h2').eq(i).nextUntil('h2', 'h3, li h3').toArray());
};
console.log(h3s);

预期输出为：

h3s[
0: (3) [h3, h3, h3]
1: (3) [h3, h3, h3]
2: (3) [h3, h3, h3]
]

而实际输出是：

h3s[
0: (3) [h3, h3, h3]
1: (3) [h3, h3, h3]
2: []
]

Answer 1

[更新以适应不同的代码模式]

---

jQuery.nextUntil((需要一个分隔符(如示例中的<h2>(。因此，HTML代码中嵌套<h3>元素的最后一部分不会被处理。首先，因为末尾没有<h2>。其次是因为他们不是兄弟姐妹。

使用您的代码，我刚刚添加了一个条件推送，首先检查<h3>是否是下一个元素。

var h3s = [];
i=0;
$( "h2" ).each( function( index, element ){
if($(this).next('h3').length>0){
if($(this).is('h2:last-of-type')){
h3s.push($('h2').eq(i).nextUntil('section').toArray());
} else {
h3s.push($('h2').eq(i).nextUntil('h2').toArray());
} }  else{
h3s.push($('h2').eq(i).nextUntil('h2').find('h3').toArray());
}
i++;
});
console.log(h3s);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<h2></h2>
<h3></h3>
<h3></h3>
<h3></h3>
<h2></h2>
<ol>
<li>
<h3></h3>
</li>
<li>
<h3></h3>
</li>
<li>

</li>
</ol>
<h2></h2>  
<h3></h3>
<h3></h3>
<h3></h3>
<section>

PS：注意，我在这里删除了演示程序的最后一个<h3>，所以你可以识别最后一个部分！

Answer 2

多亏了Bilel的each()&if(){}。

这是全套样品https://playcode.io/533251带有控制台。

获取每个h2标签下方的所有h3标签，即使它们进入<ol>或<ul>

var h3s = [];
var i = 0;
$('h2').each(function(){
if ($('h2').eq(i).nextUntil('h2').find('h3').length > 0) {
h3s.push($('h2').nextUntil('h2').find('h3').toArray());
} else {
h3s.push($('h2').eq(i).nextUntil('h2', 'h3').toArray());
} i++;
});

或者，我们可以根据页面中所有h2标签的数组的长度，将if(){}语句放入简单的for(){}循环中

var h2s = $('h2').toArray();
var h3s = [];
for (i = 0; i < h2s.length; i++) {
if ($('h2').eq(i).nextUntil('h2').find('h3').length > 0) {
h3s.push($('h2').nextUntil('h2').find('h3').toArray());
} else {
h3s.push($('h2').eq(i).nextUntil('h2', 'h3').toArray());
}
};