使用JavaScript Image对象更改<img/>图像

Question

我有一个JavaScript Image object，我用jQuery动态加载。

我想要做的是使用<img />对象上存储的图像更改Image图像。我该怎么做？

注意：我想避免更改<img />标记的来源，因为它会再次从服务器下载它，并且我已将图像存储在我的图像对象中

Answer 1

你的意思是

$('#imageToChange').replaceWith(imageObject)

Answer 2

新图像对象：

var Image_off = new Image();
Image_off.src = 'first.jpg';

使用jQuery更改图像src：

$("#my_image").attr("src",Image_off.src);

Answer 3

使用jQuery ... 根据逻辑条件，在页面上已存在两个图像并显示或隐藏任一图像。

Answer 4

在javascript内存中创建新图像，然后将其附加到原始图像之后，然后删除原始图像。您可能还希望在删除之前缓存原始文件，以防您想重新使用它。

HTML

<img id="replace" />

JS

var img = new Image();
img.src = "someUri.png";
$("#replace").after(img);
$("#replace").remove();