根据特定图像更改img源

Change the img source based on a specific image

本文关键字:img 图像      更新时间:2023-09-26

我有一个页面,其中有几个图标图像需要更改。我无法通过ID获取图像,因为它们是由服务器生成的,所以总是会更改,但我可以通过类名获取。

因此,我想更改页面上的几个图标图像中的4个,方法是获取图像源并检查它是否符合我想要更改的图像的标准,然后交换新的图标图像。

我有一些javascript和JQuery的笨拙版本,但我真的在寻找一个功能简单的光滑版本。

我确实发现这对4个需要在多个位置更改的独立图像很有效:

 function changeArrow() {
            $('img[src="chevron-orange-round-down.jpg"]').attr('src', 'chevron-blue-round-down.jpg')
            $('img[src="chevron-orange-round-up.jpg"]').attr('src', 'chevron-blue-round-up.jpg') 
            $('img[src="chevron-orange-round-left.jpg"]').attr('src', 'chevron-blue-round-left.jpg') 
            $('img[src="chevron-orange-round-right.jpg"]').attr('src', 'chevron-blue-round-right.jpg') 
        }

我原以为我需要一个循环,比如下面建议的每个循环,但这改变了所有符合标准的图像实例。

您可以设置src属性$('.image').attr('src', 'val');

或者通过简单的环路

$('.image').each(function(i, obj) {
    if($(this).attr('src')=='some criteria')
    {
    $(this).attr('src', 'val');
    }
});