通过jquery有条件地将类添加到图像中

Conditionally add class to image by jquery

本文关键字:添加 图像 jquery 有条件 通过      更新时间:2023-09-26

此JS将以下所有图像中的图像文件名default.jpg替换为hqdefault.jpg。但现在我正在尝试将类添加到Image中,如果Imagesrc通过扩展此JS在图像上具有img.youtube.com链接。

JS:

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

HTML:

<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>

意味着,如果image src有Youtube image,则向父image添加一个类.video

尝试:

$('#selector img').each(function(i) {
    var self = $(this);
    var src = self.attr('src');
    if (src.match(/img.youtube.com/)) {
        self.attr('src', src.replace("/default.jpg","/hqdefault.jpg"));
        self.addClass('video');
    }
});

您可以在替换和添加视频类之前添加一个条件。

$('#selector img').attr('src',function(i,e){
    if($(this).attr('src').search('img.youtube.com') > 0){
         $(this).addClass('video');
    }
    return $(this).attr('src').replace("default.jpg","hqdefault.jpg");
});