不使用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屬性未替換

Answer 1

您不需要調用replace() ，只需設置新的src即可：

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

Answer 2

參見http://api.jquery.com/attr/#attr2 ：

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

Answer 3

您可以使用更改值

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

如果您正在使用：

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

該函數將返回一個字符串。 字符串不會通過引用傳遞，而是被復制。 因此修改它實際上並沒有改變它。

Answer 4

您可以使用以下命令直接設置src的值：

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

http://jsfiddle.net/VFgn8/

看看attr() jQuery文檔 。

Answer 5

或者你可以使用prop()

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

工作演示

Answer 6

原因是因為replace方法實際上返回了新字符串-不在原地對其進行編輯。

您可以這樣實現您想要的：

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

這通過調用函數（第二個參數）為src屬性設置了一個新值。 該函數實際上returns替換值。

實時示例（使用開發人員工具檢查src）： http : //jsfiddle.net/4K3Dy/