javascript - jquery，如何在 css 范围内使用 nextAll()

Question

HTML：

<div class="my_1"></div>

<div class="my_big">     
      <div class="small" id="id_1"></div>      
      <div class="small" id="id_2"></div>     
      <div class="small" id="id_3"></div>      
      <div class="small" id="id_4"></div>      
</div>

javascript:

var css_scope=$(".my_big");
var next_div=$(".my_1").nextAll('.small',css_scope).first();

console.log(" \n next div = "+ next_div.attr('id'));

控制台显示undefined。my_big但是，如果我从 html中排除div 并var next_div在 javascript 中定义如下：

var next_div=$(".my_1").nextAll('.small').first();,

得到预期的输出。

如何nextAll()使用提到的 css 作用域？

Answer 1

您无法使用.small，因为它们不是兄弟姐妹my_1。nextAll()您可以使用以下选择器来访问它。

// Get the first element matching ".small" inside an element matching ".my_big"
// that comes immediately after an element matching ".my_1"

var next_div = $('.my_1 + .my_big > .small:first')​;

检查这个演示：http: //jsfiddle.net/q6XKR/

Answer 2

如果要访问my_bigdiv 中的第一个元素，则无需带入my_1场景。

var next_div = $('.my_big').find('.small').first();

console.log(" \n next div = "+ next_div.attr('id'));

希望它能让您对在 jQuery 中遍历元素有所了解。

Answer 3

.nextAll用于查找所有下一个兄弟姐妹，您应该.small从nextAll.

var next_div=$(".my_1").nextAll('.my_big').find('.small').first();