用JavaScript在一个div中显示图片？

Question

我的JS不是很好，但我认为我需要使用类似于getElementById这样的东西：

if (a == ‘tick’)
document.getElementById(‘imageDiv’) = tick.gif
else
document.getElementById(‘imageDiv’) = cross.gif
<div id="imageDiv"></div>

但它不起作用。

- user1234315

---

@Black_Crown imageDiv 是一个 div，为其设置 src 属性不会显示任何图像。 - kirilloid

Answer 1

使用这个，应该可以正常工作。

<script type="text/javascript">
function image(thisImg) {
    var img = document.createElement("IMG");
    img.src = "images/"+thisImg;
    document.getElementById('imageDiv').appendChild(img);
}
if (a == 'tick') {
    image('tick.gif');
} else {
    image('cross.gif');
}
</script>
<div id="imageDiv"></div>

- PHP Ferrari

---

谢谢，你不仅解决了我的问题，还提供了我需要开发的精确代码，感谢。 - user1234315

Answer 2

尝试使用这个替代方案：

document.getElementById('imageDiv')
    .innerHTML = '<img src="imageName.png" />';

或者您可以像这样动态创建图像元素：

var par = document.getElementById('imageDiv');
var img = document.createElement('img');
img.src = 'put path here';
par.appendChild(img);

还要注意，字符串应该使用单引号或双引号而不是 ‘ 字符。

---

这里是你的代码应该是这样的：

var imgName = a === 'tick' ? 'tick.gif' : 'cross.gif';
document.getElementById('imageDiv')
    .innerHTML = '<img src="' + imgName + '" />';

或者可以选择以下方法：

var imgName = a === 'tick' ? 'tick.gif' : 'cross.gif';
var par = document.getElementById('imageDiv');
var img = document.createElement('img');
img.src = imgName;
par.appendChild(img);

或者如果你想把图片应用到 div 的背景上，那么你需要这样做：

var imgName = a === 'tick' ? 'tick.gif' : 'cross.gif';
document.getElementById('imageDiv').style.backgroundImage = 'url('+ imgName +')';

- Sarfraz

Answer 3

为了在一个div中显示图片，你必须将它设置为背景图片：

document.getElementById(‘imageDiv’).style.backgroundImage = 'url(tick.gif)';

- Teneff

Answer 4

document.getElementById('imageDiv').innerHTML = 
 '<img src="' + (a == 'tick'?'tick':'cross') + '.gif">';

- Cheery