Question

A similar question was asked before，但我正在寻找仅使用下面的html的jQuery解决方案（即没有类或id属性）：

<h2>Foo</h2>
<p>asdf</p>
<ul><li>asdf</li></ul>
<p>asdf</p>
<h2>Bar</h2>
<p>asdf</p>
<p>asdf</p>
<h2>Baz</h2>
<p>asdf</p>
<p>asdf</p>

我想使用一些jQuery：

$('h2').afterButBeforeNext('h2').doSomething();

这应该：

选择指定元素之后的所有兄弟元素，但在下一次出现指定元素之前。
如果没有结束元素，则选择其下的所有元素。

Answer 1

prev选择器应该能够：http://docs.jquery.com/Selectors/siblings#prevsiblings

$("h2 ~ *:not(h2)").doSomething();

您仍然需要某种id或属性来选择一个单独的h2元素。

Answer 2

使用核心jQuery函数的最简单的解决方案：

$('h2').nextUntil('h2').doSomething();

Jonathan Snook向我指出了解决这个问题的jQuery 1.4函数：

nextUntil()

查看它的兄弟功能：

灵感来自：

Answer 3

这个怎么样？

function selectBetween(node1,node2,parent)
{
    var p = $(parent);
    var n1 = p.find(node1);
    var n2 = p.find(node2);
    var results = [];
    var start = false;
    var end = false;
    p.children().each(function()
    {
        if(!start && !end)
        {
            if($(this) === n1)
            {
                start = true;
            }
            results.push(this);
            if($(this) === n2)
            {
                end = true;
                return;
            }
        }
    });
    return results;
}
var between = selectBetween($(parent).find('h2:first'), $(parent).find('h2:last'), parent);

Answer 4

为了演示，h2标签内容变为红色，p，ul标签内容变为绿色：

$('#container').children().each(function(){
    if(this.nodeName == 'H2'){
        $(this).css('color','red');
        $(this).nextAll().each(function(){
            if(this.nodeName != 'H2'){
                $(this).css('color','green');
            }
        });        
        return false; //exit here to only process the nodes between the first H2 and second H2 found.
    }
});

请注意，我假设您的示例中未显示#container div。如果没有容器，请使用$（body）.children（）。

Answer 5

您可以这样做：

var name = "h2";
$(name).each(function() {
    var siblings = [], sibling=this.nextSibling;
    while (sibling && sibling.nodeName.toLowerCase() != name) {
        siblings.push(sibling);
        sibling = sibling.nextSibling;
    }
    // siblings now contains an array of sibling elements that are not h2
});

如何选择两个相同标签之间的所有内容？

5 个答案: