Показать изображение в div с javascript?

my js не очень хорошо, но я думаю, что мне нужно будет использовать getElementbyId, которые некоторые думают как:

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

но не работает.

Ответ 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>

Ответ 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 +')';

Ответ 3

Чтобы отобразить изображение в div, вы должны установить его как фоновое изображение:

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

Ответ 4

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