Question

我找到了相关的答案，但不像这个主题一样，所以我问了这个问题。

我的问题是，我正在尝试将图片文件名default.jpg替换为下面所有图片中的hqdefault.jpg，我无法手动更改图片链接，所以我必须通过jquery更改它

图片

<div id="selector">
    <img src="http://img.youtube.com/vi/qDc_5zpBj7s/default.jpg">
    <img src="http://img.youtube.com/vi/ss7EJ-PW2Uk/default.jpg">
    <img src="http://img.youtube.com/vi/ktd4_rCHTNI/default.jpg">
    <img src="http://img.youtube.com/vi/0GTXMEPDpps/default.jpg">
</div>

JS 我试过

$('#selector img').attr('src',function(i,e){
    return e.replace("default.jpg","hqdefault.jpg");
});

问题是它是否更改（删除）指向hqdefault.jpg的整个链接，但我想要从所有/任何图像src仅更改 default.jpg到hqdefault.jpg。

如何简单地替换所有图像文件名？

示例

<img src="http://img.youtube.com/vi/qDc_5zpBj7s/default.jpg">
to
<img src="http://img.youtube.com/vi/qDc_5zpBj7s/hqdefault.jpg">

请勿在js上使用完整图片链接，因为视频会动态生成图片链接/ ID，只需将default.jpg替换为hqdefault.jpg jquery。

Answer 1

试试这个

$('#selector img').attr('src',function(i,e){
    return $(this).attr('src').replace("default.jpg","hqdefault.jpg");
});

Answer 2

You can also try this:

$('#selector img').on({
        'click': function(){
          var src1 = $(this).attr("src"); 
          var path = src1.substring(0,src1.lastIndexOf('/'));
          var new_source=path+'/'+'hqdefault.jpg';
            $(this).attr('src',new_source);
        }
    });

Answer 3

您应该使用each函数来遍历所有img。以下代码段可能会对您有所帮助。

$('#selector img').each(function(){
    var src = $(this).attr('src').replace("default.jpg","hqdefault.jpg");
    $(this).attr('src', src);
});

<强>更新
如果您使用的是LazyLoad XT插件，请在其onload事件中执行相同操作，如下所示。

$.lazyLoadXT.onload=function(){
      var src = $(this).attr('src').replace("default.jpg","hqdefault.jpg");
      $(this).attr('src', src);
 }

用jquery替换图像文件名

3 个答案: