使用jQuery动态替换图像源

Question

我正在尝试用我自己的商家替换默认的Yelp星级评分图片。为此，我需要为可能已加载的每个可能的5个图像找到相应的图像源。然后，基于此我需要加载我创建的正确图像。

<div id="starRating">
    <img src="http://yelp-star-1.png"/>
</div>

所以，yelp-star-1.png将被my-star-1.png取代。等等等等。这可能很简单，但我是jQuery的新手，我发现的一切都没有正常工作。非常感谢您的专业知识！

Answer 1

$("#starRating img").attr("src", "http://pathto/my-star-1.png")

修改

我认为您正在询问如何根据当前的内容动态替换src。因此，如果字符串中存在一些直接差异，可以尝试

var img = $("#starRating img");
img.attr("src", img.attr("src").replace("yelp", "my"));

Answer 2

如果您只是尝试在没有任何模式的情况下进行基本替换：

$('img[src="http://website.com/images/yelp-star-1.png"]').attr('src','http://website.com/images/my-star-1.png');

这可以用于具有以http://website.com/images/yelp-star-

开头的src属性的图像

$('img[src^="http://website.com/images/yelp-star-"]').each(function() {
   $(this).attr('src', $(this).attr('src').replace("yelp", "my"));
});  

Answer 3

@GrayB给了我一个很好的解决方案 - 这不需要你知道绝对的img src：

jQuery('.element img').each(function() {
    jQuery(this).attr('src', jQuery(this).attr('src').replace("find_", "replace_"));
});