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