使用带有 jQ​​uery 的 img 元素替换指向图像的链接

Question

使用 jQuery，我试图用 img 元素替换某个 div 中的所有图像链接（.jpg、.png、.tiff、.gif），以显示图像而不是链接给它。

例如。它会改变

<a href="http://domain.com/image.jpg">Any Text Here</a>

到

<img src="http://domain.com/image.jpg"/>

提前非常感谢你:)

Answer 1

$('a.img').each(function(){
    //assuming they have the image class
    var img = $('<img>',{src: this.href});
    $(this).replaceWith(img);
});

试试看^_^

更新

如果所有图像都没有相同的类：

$('a').each(function(){
    var ext = getfileextension(this.href);
    switch(ext){
        case '.gif':
        case '.png':
        case '.jpg':
            var img = $('<img>',{src: this.href});
            $(this).replaceWith(img);
            break;
    }

});
function getfileextension(filename) 
{ 
    var dot = filename.lastIndexOf("."); 
    if( dot == -1 ) return ""; 
    var extension = filename.substr(dot,filename.length); 
    return extension; 
} 

看到这个小提琴：http://jsfiddle.net/maniator/3pXEm/

Answer 2

Neal's answer 的更简单版本，使用 Attribute Ends With selectors：

$("a[href$='.png'], a[href$='.jpg'], a[href$='.tiff'], a[href$='.gif']").each(function() {
    var img = $('<img>',{src: this.href});
    $(this).replaceWith(img);
});