javascript - 使用 jQuery 从 HTML 中的多个图像元素中删除文件路径

Question

我试图保留文件名，但从页面上的图像元素中删除文件路径，并且我已经根据从类似问题中收集到的信息设法找出以下内容。

我只能删除文件路径，但我无法弄清楚为什么第一个图像的源被复制到其他两个图像中。

<小时/>

这是我到目前为止整理的内容

HTML

<img src="/path/to/image.gif" />
<img src="/different/path/to/picture.jpg" />
<img src="another/path/to/graphic.png" />

JS

var abc = $('img').attr('src');
var def = abc.split('/').pop();

$('img').attr('src', def);

结果

<img src="image.gif">
<img src="image.gif">
<img src="image.gif">

http://jsfiddle.net/aztdeu0w/

Answer 1

您没有遍历所有 img 元素，请尝试以下操作:

$('img').each(function(){
    var imgName = $(this).attr('src').split('/').pop();
    $(this).attr('src', imgName);
});

这样您将循环遍历所有图像并相应地替换 src 属性。