javascript - jqueryを使用してimg src属性を置き換えない

Question

javascriptを使用してimg src属性を置き換えています

私のコードは

<div class="reader" id="reader1"></div>    

    <img src="images/img_001.jpg" alt="image" id="image1"/>

</div>

とJavaScriptコード

$("#image1").attr("src").replace("images/img_001.jpg", "images/img_002.jpg");

src 属性は置き換えられません

score 2 · Accepted Answer

を呼び出す必要はありませんreplace()。新しい src を設定するだけです。

$("#image1").attr("src", "images/img_002.jpg");

score 1 · Accepted Answer

の値は次のように直接設定できますsrc。

$("#image1").attr("src", "images/img_002.jpg");

score 1 · Accepted Answer

$("#image1").attr("src", "images/img_002.jpg");

score 1 · Accepted Answer

を使用して値を変更できます。

$('#image1').attr('src', 'images/img_002.jpg');

使用している場合:

$('#image1').attr('src');

関数は文字列を返します。文字列は参照渡しではなく、コピーされます。したがって、変更しても実際には変更されません。

score 0 · Accepted Answer

またはあなたが使用することができますprop()

$("#image1").prop("src", "images/img_002.jpg");

score 0 · Accepted Answer

その理由は、replaceメソッドが実際に新しい文字列を返すためです。その場で編集するのではありません。

次のようにして、必要なものを達成できます。

$("#image1").attr("src", function(){
    return $(this).attr('src').replace("images/img_001.jpg", "images/img_002.jpg");
});

srcこれは、関数を呼び出して属性に新しい値を設定します (2 番目のパラメーター)。この関数は、実際returnsには置き換えられた値です。

実際の例 (開発者ツールで src を確認してください): http://jsfiddle.net/4K3Dy/

6 に答える 6