用jquery替换图像文件名

Replace image file name by jquery

本文关键字：文件名 图像 替换 jquery      更新时间：2023-09-26

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

我的问题是，我正在尝试从下面的所有图像中将图像文件名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，只需用jquery将default.jpg替换为hqdefault.jpg即可。

尝试这个

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

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);
        }
    });

您应该使用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);
 }
相关文章：