找到所有的圖片鏈接，如果我有一堆的鏈接添加一個類它

Question

像這樣的圖像：

<a href="foo.png">foo.png</a> <a href="foo.jpg">foo.jpg</a> <a href="foo.gif">foo.gif</a> 

我怎麼會覺得所有的JS，然後添加一個類？

這是我的想法，但沒有奏效：

$('a[href*=.png]').addClass('image-link'); 
$('a[href*=.jpg]').addClass('image-link'); 
$('a[href*=.gif]').addClass('image-link'); 

UPDATE：有在我的js一個錯字。以上作品。

Answer 1

你的第一種方式，更新的方式似乎工作過。

$('<a href="foo.png">foo.png</a> <a href="foo.jpg">foo.jpg</a> <a href="foo.gif">foo.gif</a>').appendTo('body') 

$('a[href]').filter(function() { 
    return /(jpg|gif|png)$/.test($(this).attr('href')) 
}).addClass('image-link') 

alert($('.image-link').length) 

你確定你已經準備好了DOM，而且你的目標是正確的，沒有錯別字？

$('<a href="foo.png">foo.png</a> <a href="foo.jpg">foo.jpg</a> <a href="foo.gif">foo.gif</a>').appendTo('body') 


$('a[href*=".png"]').addClass('image-link'); 
$('a[href*=".jpg"]').addClass('image-link'); 
$('a[href*=".gif"]').addClass('image-link'); 

alert($('.image-link').length) 

^這也提醒我3。

更新：更簡潔的選擇將是..

$('a[href*=".png"], a[href*=".gif"], a[href*=".jpg"]') 

Answer 2

嘗試是這樣的（注意周圍.png單引號）：針對剛剛PNG和FF 3.5工作正常

$("a[href*='.png']").addClass("image-link"); 

Answer 3

試試這個：

var aFileExts = new Array("png", "jpg", "fig"); 
for(aIndex in aFileExts) { 
    aFileExt = aFileExts[aIndex]; 
    $("a[href$='.".aFileExt."']").addClass("image-link"); 
}

希望這有助於。