如何在html中编写一个javascript变量作为img标记的源代码

Question

我有一个变量,它可以引用不同的图像.例如,有时候我有 var imageName = "A.png".我想将div标签的innerHTML设置为"src=" + imageName + ">"但不起作用.当我使用alert来获取innerHTML实际上是什么时,我得到了这个<img src="A" .png="">.为什么会这样？

根据请求,这里是我的HTML代码与此问题有关.它是从servlet接收xml文件的更大代码体的一部分.我觉得奇怪的是底部的for循环工作正常,但img src位没有.

编辑:我设法<img src="/Users/adamsturge991/Desktop/webapp/Ass5/WEB-INF/classes/A.png">通过更改servlet编写的内容将innerHTML转换为表单(我添加了绝对路径以确保可以找到该文件.)但是图片仍然没有加载.奇

function displayResult(req)
{
    var doc = req.responseText;
    parser=new DOMParser();
    xmlDoc=parser.parseFromString(doc,"text/xml");


    var imageName = xmlDoc.getElementsByTagName('ImageName').item(0).textContent + ".png";

    var comments = xmlDoc.getElementsByTagName('Comment');

    var imgDisplay = document.getElementById('ImageDisplay');

    var str = "<img src=" + imageName + ">"; 
    alert(str);
    imgDisplay.innerHTML = str;
    alert(imgDisplay.innerHTML);
    str = '';
    for (var j = 0; j < comments.length; j++)
    { 
        str = str + "<p>"+ comments.item(j).textContent + "</p>";   
        }

    var commentDisplay = document.getElementById('CommentDisplay'); 
    commentDisplay.innerHTML = str;

}

Answer 1

我觉得这个例子很有用:

var url = "www.example.com/image.jpg";
var img = new Image();
img.src = url;
document.body.appendChild(img);

您只需要进行一些调整以适应您的需求