Question

我正在使用以下简单的jquery函数，但我想在具有不同类的多个元素上使用它。如何使用数组缩短代码？

$(function() {

  $('.red').attr("href", "images/gallery/redSmall.jpg");
  $('.blue').attr("href", "images/gallery/blueSmall.jpg");
  $('.green').attr("href", "images/gallery/greenSmall.jpg");
  $('.black').attr("href", "images/gallery/blackSmall.jpg");

});

谢谢

Answer 1

我正在使用类的数组，而不是使用for循环applay，href会更改为匹配的元素：

$(function() {
    var classes = ['red', 'blue', 'green', 'black'];

    for(var i=0; i < classes.length; i++)
    {
        $('.'+classes[i]).attr("href", "images/gallery/"+classes[i]+"Small.jpg");
    }
});

**您可以根据需要添加任意数量的课程。

Answer 2

JQuery方式是

$(function() {
    $.each(['red', 'blue', 'green', 'black'],function(index,item){
         $('.'+item).attr("href", "images/gallery/"+item+"Small.jpg");
    });
});

但是，如果你更好地编写HTML，你可以做得更短...... 将“red”，“blue”...移动到另一个属性，并为所有属性添加一个类。

之类的东西

<a class="color" data-color="red" href="javascript:void(0)"/>
<a class="color" data-color="blue" href="javascript:void(0)"/>
...

然后你的JS会更通用，而且很短

$(".color").each(function(item,index){ $(this).attr("href","images/gallery/"+this.attr("data-color")+"Small.jpg"});

在jquery中创建一个数组并寻址多个元素

2 个答案: