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

您可以使用 .slice()

将匹配元素集减少到由范围指定的子集索引

并使用 .map() ：

将文本值推送到数组中

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

<强> Fiddle Demo

Answer 3

一种动态方式是按班级长度计算。

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 4

按索引引用它们

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

要获取文字值，只需使用text()

即可

Answer 5

使用

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

它将返回3和4 div文本的文本 Fiddel

Answer 6

jQuery有一个简单的get函数

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

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

Answer 7

如果您计划在第三和第四个div上执行相同的操作，请使用以下代码：

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

如果您想对它们执行不同的任务，那么

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

现在，您可以将自定义事件绑定到这些特定的div。

例如：

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

使用JQuery获取类的中间值

7 个答案: