更改 HTML 图像标记的 src 以使用 Javascript 从 url 加载图像答案

【问题标题】：Change the src of HTML image tag to load image from a url using Javascript更改 HTML 图像标记的 src 以使用 Javascript 从 url 加载图像
【发布时间】：2015-11-30 22:17:50
【问题描述】：

抱歉，我是初学者，听起来很幼稚。我一直在尝试在我的网站上加载一张图片，该图片在网上其他地方托管，并且网址为“http://www.vapor-rage.com/wp-content/uploads/2014/05/sample.jpg”

我有一个如下定义的图像标签

<img id="image" src="" alt="" />

此外，我的 javascript 函数在单击按钮时执行以下操作

document.getElementById("image").src="http://www.vapor-rage.com/wp-content/uploads/2014/05/sample.jpg";

该 URL 似乎可以正常工作，但点击时图片未显示。

我有什么错误吗？

感谢您的任何建议:)

【问题讨论】：

你确定正确的函数触发点击？
是的，我检查过 :(

标签： javascript html image dynamic

【解决方案1】：

我可以看到您在这里使用"，可能HTML 也会有"，所以它可能无法正常工作。您可以使用以下代码：

<a href="#"
   onclick='document.getElementById("image").src="http://www.vapor-rage.com/wp-content/uploads/2014/05/sample.jpg"; return false'>Change</a>

【讨论】：

感谢您的快速回复。我检查了它，但不幸的是这不是问题:(

【解决方案2】：

我创建了一个 Jsfiddle，它似乎工作正常。 https://jsfiddle.net/ltlombardi/jvts4m3y/

var coco = function(){
document.getElementById("image").src="http://www.vapor-rage.com/wp-content/uploads/2016/02/Vapor-Rage-Small-Logo-new.png";
};

<img id="image" src="" alt="" />
<a href="javascript:void(0);" onclick="coco()">Click here</a>

【讨论】：