不使用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/

查看jQuery doc for attr()。

Answer 5

或者您可以使用prop()

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

Working Demo

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/