将字符串转换为 img src

Question

<label id="lbl"></label>我正在尝试根据包含URL字符串的变量“a”显示此图像。有人可以帮助我完成缺少的步骤吗？var a = "https://encrypted.google.com/images/logos/ssl_logo.png";document.getElementById("lbl").innerHTML =  '<img src=a >';

Answer 1

你有，它将把属性设置为文字值。相反，您希望将变量的值添加到 HTML 中。幸运的是，现在的字符串模板使这变得容易：.innerHTML = '<img src=a >';srcaa

document.getElementById("lbl").innerHTML = `<img src="${a}" />`;

在“反引号”字符中，表达式中出现的任何内容都会被计算并注入到字符串中。请注意，我还用引号将你的属性值括起来;尽管HTML解析器是宽容的，但省略这可能会导致问题。${...}src

Answer 2

您需要创建一个元素，其值为 和 和：imgsrcaappendlabel

var a = "https://encrypted.google.com/images/logos/ssl_logo.png";

let img = document.createElement("img");

img.src = a;

document.getElementById("lbl").appendChild(img);

<label id="lbl"></label>

但是，您可以使用模板文本来修复代码：

var a = "https://encrypted.google.com/images/logos/ssl_logo.png";

document.getElementById("lbl").innerHTML =  `<img src=${a}>`;

<label id="lbl"></label>

Answer 3

您只需连接字符串即可。

document.getElementById("lbl").innerHTML =  '<img src="' + a +'" \>';

Answer 4

您应该插值字符串。 而不是“”;<img src=${a} >