数组值正在滚雪球

Question

我是第一个与Arrays一起工作的新手.我正在从一系列Img标签中收集所有css背景颜色值并用它构建一个数组.但是数组中的每个值都是之前值的滚雪球.如何在阵列中输出EACH值？这是我的代码:

var slideArray = [];
$('.home-rotator-wrap .cycle-slideshow > div img').each(function() {
    slideArray.push($(this).css('background-color'));
    console.log(slideArray);
});

我的控制台告诉我的是:

["rgb(255, 0, 0)"]
["rgb(255, 0, 0)", "rgb(0, 255, 0)"]
["rgb(255, 0, 0)", "rgb(0, 255, 0)", "rgb(0, 0, 255)"]
["rgb(255, 0, 0)", "rgb(0, 255, 0)", "rgb(0, 0, 255)", "rgb(0, 0, 0)"] 

我需要四个img标签的每个值,但需要分别返回每个标签.

所有这些都是为了能够循环遍历数组的值并在定时动画中返回每个值.它是页面的背景,需要匹配cycle2滑块的动画.

Answer 1

你的代码有效.您只需将console.log语句放在错误的位置,因此它会在每次循环后记录数组的进度.如果您只想记录一次,请将其移出循环.

顺便说一下,您不必手动将这些值推送到阵列上.你可以用map它:

var slideArray = $('.home-rotator-wrap .cycle-slideshow > div img').map(function() {
    return $(this).css('background-color');
}).get();

为了获得更好的性能,您应该考虑使用静态$.css方法,而不是为集合中的每个元素创建新对象:

var slideArray = $('.home-rotator-wrap .cycle-slideshow > div img').map(function() {
    return $.css(this, 'background-color');
}).get();

console.log(slideArray);