web-dev-qa-db-ja.com

画像ソースをjQueryに動的に置き換えます

ビジネス向けのデフォルトのYelpの星評価画像を自分のものに置き換えようとしています。そのためには、ロードされた可能性のある5つの画像のそれぞれに対応する画像ソースを見つける必要があります。そして、それに基づいて、作成した適切なイメージをロードする必要があります。

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

したがって、Yelp-star-1.pngはmy-star-1.pngに置き換えられます。などなど。これはおそらくかなり単純ですが、私はjQueryを初めて使用し、見つけたすべてが正しく機能していません。あなたの専門知識は非常に高く評価されています！

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

編集

あなたは現在あるものに基づいてsrcを動的に置き換える方法を尋ねていると思います。したがって、文字列に直接的な違いがある場合は、試してみてください

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

パターンなしで基本的な置換を実行しようとしている場合：

$('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"));
});
4
GrayB

@GrayBは私に良い解決策を与えました-これはあなたが絶対的なimgsrcを知っている必要はありません：

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