jQuery如何将多个img srcs附加到数组中

Question

我的jQuery / JS已设置好，因此在doc加载时它会查找所有img srcs并将它们推送到一个数组中：

var sliderImg = [];
sliderImg.push($('.thumbnail').children('img').attr('src'));

然后我有代码在点击事件上提醒数组：

$('.thumbnail').each(function() {
$(this).click(function() {
    alert(sliderImg);
});
});

但是，它只添加了第一个img src路径，是否可以添加所有这些路径？

谢谢！

Answer 1

你可以使用each ;

$('.thumbnail').children('img').each(function() {
  sliderImg.push($(this).attr('src');
});

Answer 2

根据.attr()文档

获取匹配元素集中第一个元素的属性值

所以$('.thumbnail').children('img').attr('src')只返回第一个图像的来源。

您可以使用.each()迭代图像并逐个推送源：

var sliderImg = [];
$('.thumbnail').children('img').each(function() {
    sliderImg.push($(this).attr('src'));
});

Answer 3

attr方法，当用作getter时，返回集合中第一个元素的属性。 如果需要所有属性的数组，则必须遍历所有元素。 您可以使用each方法或更方便的map ：

var sliderImg = $('.thumbnail').children('img').map(function() {
    return this.src;
}).get();