Question

我正在定制tumblr博客，我想根据照片集中的照片数量应用某些样式和规则。我不确定当每个帖子具有相同的类时，如何计算每个帖子中存在的子元素。如果这是由tumblr生成的那种代码：

<div class="photoset">
     <img />
     <img />
</div>

<div class="photoset">
     <img />
     <img />
     <img />
</div>

如何让jQuery返回第一个和第二个实例（即2和3）中的元素数量？

我尝试使用$('.photoset img').length();，这样就可以得出所有元素的总数（在这种情况下为5）。

非常感谢任何帮助！

干杯，斯科特

Answer 1

你可以循环浏览每个photoset项目并分别计算它们的图像，然后在代码中的那一点做任何你想要的信息：

$(".photoset").each(function(index, elem) {
    var numImages = $(this).find("img").length;
    // do whatever processing you wanted to with numImages here
});

如果你想把这些计数放在一个数组中，你可以这样做：

var imgCountArray = $(".photoset").map(function() {
    return($(this).find("img").length)
}).get();

Answer 2

尝试以下，

var imgCounts = [];

$('.photoset').each (function () {
  imgCounts.push($(this).find('img').length);
});

现在，

imgCounts[0] = 2 //first divs img count
imgCounts[1] = 3 //second divs img count

Answer 3

有几种方法可以解决这个问题。

首先，您可以使用.each()循环浏览每个.photoset：

$('.photoset').each( function() {
   var num = $(this).find('img').length;
   // Do something based on num
});

或者，使用.eq()或:eq()选择某个：

var num = $('.photoset:eq(1) img').length;

var num = $('.photoset').eq(1).find('img').length;

Answer 4

你可以使用：

$(".photoset").each(function(i, photoset) {
  photoset = $(photoset); 
  var numImages = photoset.children().length;
  // or var numImages = photoset.find("img").length; for only images

  if (numImages === 2) {
    // your code
  }
  if (numImages === 3) {
    // your code
  }

  // or just comparing whether greater or lower
  if (numImages > 2) {
    // your code
  }
});

Answer 5

$('.photoset:first img').length

和

$('.photoset:last img').length

从一个类的实例中获取子元素的数量

5 个答案: