jQuery 属性（）。更改图像块和扩展名的来源答案

【问题标题】：jQuery attr(). Changing the source on a block of images and the extensionjQuery 属性（）。更改图像块和扩展名的来源
【发布时间】：2011-10-26 05:28:25
【问题描述】：

我正在从 API 中检索一些图像并将它们更改为我自己的图像，如下所示：

$('img[src="http://www.example.com/dir/images/dir/1.gif"]').attr('src', "http://cdn.example.com/dir/1.gif");
$('img[src="http://www.example.com/dir/images/dir/2.gif"]').attr('src', "http://cdn.example.com/dir/2.gif");
$('img[src="http://www.example.com/dir/images/dir/3.gif"]').attr('src', "http://cdn.example.com/dir/3.gif");
$('img[src="http://www.example.com/dir/images/dir/4.gif"]').attr('src', "http://cdn.example.com/dir/4.gif");
$('img[src="http://www.example.com/dir/images/dir/5.gif"]').attr('src', "http://cdn.example.com/dir/5.gif");
$('img[src="http://www.example.com/dir/images/dir/6.gif"]').attr('src', "http://cdn.example.com/dir/6.gif");
$('img[src="http://www.example.com/dir/images/dir/7.gif"]').attr('src', "http://cdn.example.com/dir/7.gif");
$('img[src="http://www.example.com/dir/images/dir/8.gif"]').attr('src', "http://cdn.example.com/dir/8.gif");
$('img[src="http://www.example.com/dir/images/dir/9.gif"]').attr('src', "http://cdn.example.com/dir/9.gif");
$('img[src="http://www.example.com/dir/images/dir/10.gif"]').attr('src', "http://cdn.example.com/dir/10.gif")

现在，由于文本太多，我将其压缩如下：

$('img[src^="http://www.example.com/"]').each(function(index,element){
  var $this, src, newSrc;
  $this = $(this);
  src = $this.attr('src');
  newSrc = src.replace('www.example.com/dir/images/dir', 'cdn.example.com/dir');
  $this.attr('src', newSrc);
});

现在，我想将图像扩展名更改为 .png。所以基本上我想替换每个图像的 URL 以及从 .gif 到 .png 的扩展名。

我怎样才能做到这一点？

【问题讨论】：

jsfiddle.net/ZHUWD Darin 或 Tobias 提供的解决方案工作正常。您应该包含围绕上述 sn-p 的其余代码。您很有可能遇到范围界定问题。
@rkw 谢谢。你是对的

标签： javascript jquery image attr

【解决方案1】：

怎么样：

$('img[src^="http://www.example.com/"]').each(function(i, value) {
    $(this).attr('src', $(this).attr('src').replace('www.example.com/dir/images/dir', 'cdn.example.com/dir').replace('.gif', '.png'));
});

【讨论】：

【解决方案2】：

$('img[src^="http://www.example.com/"]').attr('src', function() {
    return this.src
               .replace('www.example.com/dir/images/dir', 'cdn.example.com/dir')
               .replace('.gif', '.png');
});

【讨论】：

解析原始图片
抱歉，代码中还有其他问题导致此操作无法正常工作。非常感谢

【解决方案3】：

newSrc.replace(".gif",".png");

认为这样就可以了：)

【讨论】：

你做了什么？ newSrc = newSrc.replace(".gif",".png"); ?它应该可以工作。