用javascript设置图片源和背景图片答案

【问题标题】：Set image source and background image with javascript用javascript设置图片源和背景图片
【发布时间】：2013-12-02 01:27:47
【问题描述】：

我查看了许多其他帖子，我认为我正在使用建议的确切语法。但是，我没有让图像显示出来。我有一个jsfiddle。这是一个jsfiddle问题吗？它也不适用于我正在开发的网站。

<div id="divtest">Hello</div>
<img id="imgtest" />
<img id="imgreal" src="http://www.premiumbeat.com/blog/wpcontent/uploads/2012/12/free.jpeg" />

var string = "url('http://www.premiumbeat.com/blog/wpcontent/uploads/2012/12/free.jpeg')";
alert(string)
document.getElementByID("divtest").style.backgroundImage = string;
document.getElementByID("imgtest").src = string;

【问题讨论】：

可能是因为图片不存在？否则没关系。看起来像一个 jsfiddle 问题。
JS 区分大小写：document.getElementByID !== document.getElementById。

标签： javascript image dom background-image

【解决方案1】：

两个小问题：

getElementByID 不是函数； getElementById 是。
图像源和背景图像的 url 格式不同。尝试这个： var string = '@987654321@'; document.getElementById("divtest").style.backgroundImage = "url('" + string + "')"; document.getElementById("imgtest").src = string;

【讨论】：

【解决方案2】：

将getElementByID 替换为getElementById，您的代码中还有另一个错误：

你写：

var string = "url('http://www.premiumbeat.com/blog/wp-content/uploads/2012/12/free.jpeg')";

document.getElementById("imgtest").src = string;

但是src不需要url(，所以你应该写：

var str1 = "url('http://www.premiumbeat.com/blog/wp-content/uploads/2012/12/free.jpeg')";
document.getElementById("divtest").style.backgroundImage = str1 ;

var str2 = 'http://www.premiumbeat.com/blog/wp-content/uploads/2012/12/free.jpeg';
document.getElementById("imgtest").src = str2;

希望对你有帮助

【讨论】：

你的也一样好，但当我向下滚动时，Bubbles 是第一个。谢谢！