Javascript 在特定范围内查找元素的跟随者，这些跟随者不是'；t兄弟姐妹

我正在尝试选择所选元素的以下所有元素。它们不一定是我所选元素的直接同级，因此

.nextAll（）

不起作用

下面是一个例子：

<div class="scope">
    <div> <a href="1">1</a> </div>
    <div> <a href="2">2</a> </div>
    <div> <a href="3">3</a> </div>
    <div> <a href="4">4</a> </div>
</div>

<a href="x">NOT THIS</a>

这里有一把小提琴来测试它：

如果有更好的解决方案，请随意修改。谢谢大家!

这个怎么样

我稍微更改了标记，使其具有

href='#'

，这样您就可以单击每一个元素并查看其他元素的响应

$('a').click(function(){
    $('a').css('background', 'none');    
    var scopeDiv = $(this).closest('div.scope');
    var thisIndex = $(scopeDiv).find('a').index(this);
    $(scopeDiv).find('a').not(this).each(function(index){
       if(index >= thisIndex)
           $(this).css('background', 'red');    
    });
});

这个怎么样

我稍微更改了标记，使其具有

href='#'

，这样您就可以单击每一个元素并查看其他元素的响应

$('a').click(function(){
    $('a').css('background', 'none');    
    var scopeDiv = $(this).closest('div.scope');
    var thisIndex = $(scopeDiv).find('a').index(this);
    $(scopeDiv).find('a').not(this).each(function(index){
       if(index >= thisIndex)
           $(this).css('background', 'red');    
    });
});

---

如果稍作修改，也可以使用.nextAll（）

在

html

代码中，您将

a

元素作为

div

标记的子元素。为了合并

.nextAll（）

您应该为包装

div

元素选择，然后调用

.nextAll（）

，然后为子

a

元素选择

这就是我的意思

html

<div class="scope">
    <div>
        <a href="1">1</a>
    </div>

    <!-- Start Here -->
    <div class="start">
        <a href="2">2</a>
    </div>
    <div>
       <a href="3">3</a>
    </div>
    <div>
       <a href="4">4</a>
    </div>
</div>

<a href="x">NOT THIS</a>

说明：

• 我使用

  $（'.start'）

• 然后，我使用

  .nextAll（）

• 在这些兄弟姐妹中，我选择了与“a”匹配的孩子
• 我应用css

---

这里是

作为替代，如果稍微修改一下，可以使用.nextAll（）

在

html

代码中，您将

a

元素作为

div

标记的子元素。为了合并

.nextAll（）

您应该为包装

div

元素选择，然后调用

.nextAll（）

，然后为子

a

元素选择

这就是我的意思

html

<div class="scope">
    <div>
        <a href="1">1</a>
    </div>

    <!-- Start Here -->
    <div class="start">
        <a href="2">2</a>
    </div>
    <div>
       <a href="3">3</a>
    </div>
    <div>
       <a href="4">4</a>
    </div>
</div>

<a href="x">NOT THIS</a>

说明：

• 我使用

  $（'.start'）

• 然后，我使用

  .nextAll（）

• 在这些兄弟姐妹中，我选择了与“a”匹配的孩子
• 我应用css

---

这是你说的他们不必是兄弟姐妹，但他们在你的例子中。你能举个例子说明它们不是兄弟吗？我不能控制元素的嵌套，这是任意的。想象一下，

a[href=“2”]

可以比其他的嵌套得更多。我只是想找一个更好的例子来说明不同的情况，因为我不确定我是否理解你。但你说对了。）无论如何，这里有一个例子：对于“不是兄弟姐妹”，我的意思是他们不必在DOM树中处于同一级别。你说他们不必是兄弟姐妹，但他们在你的例子中。你能举个例子说明它们不是兄弟吗？我不能控制元素的嵌套，这是任意的。想象一下，

a[href=“2”]

可以比其他的嵌套得更多。我只是想找一个更好的例子来说明不同的情况，因为我不确定我是否理解你。但你说对了。）无论如何-这里有一个例子：对于“不是兄弟姐妹”，我的意思是他们不一定必须在DOM树中处于同一级别。不知道切片，很好！这太棒了！谢谢从来都不知道切片，很好！这太棒了！谢谢这行不通，因为我只引用了

a[href=“2”]

。我无法控制我的“开始”是嵌套更深还是作为我想要的选择的父项，抱歉！这行不通，因为我只引用了

a[href=“2”]

。我无法控制我的“开始”是嵌套更深还是作为我想要的选择的父项，抱歉！

$( '.start' ).nextAll().children( 'a' ).css( 'background-color', 'red' );