Question

我有一张主图像和四张小图像。他们都有alt =“image”。

<img src="image1.png" alt="image">
<div class="other-images">
 <img src="image2.png" alt="image">
 <img src="image3.png" alt="image">
 <img src="image4.png" alt="image">
 <img src="image5.png" alt="image">
</div>

我想要做的是为数字2的小图像添加数字，如下所示：

<div class="other-images">
 <img src="image2.png" alt="image-2">
 <img src="image3.png" alt="image-3">
 <img src="image4.png" alt="image-4">
 <img src="image5.png" alt="image-5">
</div>

有一种简单的方法吗？

Answer 1

迭代图像并在增加数字的同时添加alt：

var i = 2;
$('img').each(() => {
    $(this).attr('alt', 'image-' + (i++));
});

Answer 2

你应该试试这个............

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript">
    $('.other-images img').each(function(e) {
        var alt = $(this).attr('alt');
        $(this).attr('alt', alt+'-'+(e+2));
    });
</script>

Answer 3

这是一个简单的解决方案：

var i = 2;
$('.other-images').find('img').each(function (){
    $(this).attr('alt', 'image-' + (i++));
})

这使用jQuery.each()遍历每个元素并添加适当的alt属性。

为每张图片的alt添加数字

3 个答案: