在每張圖片中添加數字

Question

我有一個主圖像和四個小圖像。他們都有alt =「圖像」。

<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，像這樣的小圖像的每一個ALT：

<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

這裏一個很簡單的解決辦法：

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

這使用jQuery.each()遍歷每個元素，並添加適當的ALT屬性。

Answer 2

遍歷圖像和ALT添加到每個而遞增數量：

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

Answer 3

你應該試試這個...........

<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>