javascript - 以 HTML 格式返回图像

Question

尝试将图像添加到我的 innerHTML。

看了几个之前的Q Why does my image not show up when I use Javascript innerHTML to call it?

Javascripts innerHTML not working for images, but works with text?

我无法让它工作，在谷歌开发工具中抛出错误:

Uncaught TypeError: Cannot set property 'innerHTML' of null

用这一行:

var newImage = document.getElementById('img').innerHTML = "<img src='images/bg-main.png></img>";

我的代码如下:

   function showImage() {
    var img = document.createElement('image');
    //var newImage = document.getElementById('img').innerHTML = "<a href='#'><img src='http://mintywhite.com/wp-content/uploads/2012/10/fond-ecran-wallpaper-image-arriere-plan-hd-29-HD.jpg' border=0/></a>";
    var newImage = document.getElementById('img').innerHTML = "<img src='images/bg-main.png></img>";
    var div5 = document.createElement('div');
    div5.appendChild(newImage);

    return div5.innerHTML;

}

我知道还有许多其他方法可以显示图像，但出于本练习的目的，我想将图像作为 innerHTML 返回

Answer 1

试试这个:

var img = document.createElement("img");
img.setAttribute('src', 'http://www.domain.com/imgSrc');
var div5 = document.createElement('div');
div5.appendChild(newImage);