以 HTML 格式返回图像答案

【问题标题】：return image as HTML以 HTML 格式返回图像
【发布时间】：2014-11-13 15:47:35
【问题描述】：

尝试将图像添加到我的 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

【问题讨论】：

为什么使用document.getElementById('img')？图片是这样的吗：<img id="img">？
@ekad：img 标签无论如何都没有内部 html。它们是单例标签。它必须是<div id="img"></div> 或其他东西。另外，为什么要创建一个图像标签，然后从不使用它？ img.src="images/bg-main.jpg"; 也可以。 OP 那里有一些严重的精神分裂症代码。
从技术上讲，您也需要 outerHTML 来包含标签，但即便如此我也不确定它是否会起作用。
我看到可能有问题的是您的 src 路径。我认为你需要它是。注意路径开头的反斜杠。
没有精神问题感谢刚开始学习 JS 的小伙伴们..加载一个乐趣

标签： javascript image innerhtml

【解决方案1】：

试试这个：

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

【讨论】：

【解决方案2】：

document.createElement('image') 创建一个新的 html 标签：<image> 我怀疑您正在尝试添加一个 div 并将图像应用为内部 html。您可以像下面这样修复此代码：

function showImage() {
    var img = document.createElement('div');
    document.body.appendChild(img)
    img.innerHTML = "<img src='images/bg-main.png></img>";
}

【讨论】：