使用jQuery获取类的中间值

Question

如何使用jQuery获取第三个和第四个值class="myDivs"？

下面是我的代码：

HTML：

<div class="myDivs">Stack</div> 
<div class="myDivs">Over</div> 
<div class="myDivs">Flow</div> 
<div class="myDivs">And</div> 
<div class="myDivs">Exchange</div> 
<div class="myDivs">Question</div> 
<div class="myDivs">Ask</div> 

Answer 1

您可以使用:eq在特定的索引来获取元素。

Live Demo

$('.myDivs:eq(2), .myDivs:eq(3)').each(function(){ 
    alert($(this).text()); 
}); 

使用的:gt和:lt组合会给你的范围。当你有很多元素时它很有用。

Live Demo

$('.myDivs:gt(1):lt(2)').each(function(){ 
    alert($(this).text()); 
}); 

编辑为了使它的动态，这样你就不必硬代码，您可以将元素集合的长度，并用它为起点的中间，这将使它的工作方式与您使用myDivs类的元素无关。

Live Demo

mid = Math.floor($('.myDivs').length /2) -2; 
$('.myDivs:gt(' + mid +'):lt(2)').each(function(){ 
    alert($(this).text()); 
}); 

Answer 2

通过索引引用它们

var myDivs = $('.myDivs'), 
    third = myDivs.eq(2), 
    fourth = myDivs.eq(3); 

为了获取文本值，只需使用text()

Answer 3

使用

$("div:nth-child(3)").html(); 
$("div:nth-child(4)").html(); 

它会回报你3和4格文本的文本 Fiddel

Answer 4

您可以使用.slice()

减少匹配的元素通过一系列的 索引指定的一个子集

并使用.map()将文本值压入数组：

var valArr = $('.myDivs').slice(2,4).map(function() { 
    return this.textContent; 
}).get(); 

Fiddle Demo

Answer 5

一个动态的方式是通过类计数的长度来计算。

var mid1=Math.ceil($('.myDivs').length/2) - 1, 
    mid2=Math.floor($('.myDivs').length/2) - 1; 
if(mid1===mid2){ 
    //handle the case 
} 
$('.myDivs:eq('+mid1+'), .myDivs:eq('+mid2+')').each(function(){ 
    alert($(this).text()); 
}); 

Here is demo

Answer 6

如果您正计划在第三和第四的div都执行相同的操作，然后使用下面的代码：

$('.myDivs:eq(2), .myDivs:eq(3)').each(function(){ 
    // perform your operation here 
}); 

如果要执行两个不同的任务其中

var myDivs = $(".myDivs"), 
    thirdDiv = myDivs[2], 
    fourthDiv = myDivs[3]; 

现在您可以将自定义事件绑定到t软管特别divs单独。

例如：

$(thirdDiv).click(function() { 
    // custom function 
}); 

Answer 7

jQuery有一个简单的get函数

http://api.jquery.com/eq/

var $myDivs = $(".myDivs"); 
var nr3 = $myDivs.eq(2); 
var nr4 = $myDivs.eq(3);