将字符串转换为 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 >';srcaadocument.getElementById("lbl").innerHTML&nbsp;=&nbsp;`<img&nbsp;src="${a}"&nbsp;/>`;在“反引号”字符中，表达式中出现的任何内容都会被计算并注入到字符串中。请注意，我还用引号将你的属性值括起来;尽管HTML解析器是宽容的，但省略这可能会导致问题。${...}src

Answer 2

您需要创建一个元素，其值为 和 和：imgsrcaappendlabelvar 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 =&nbsp; `<img src=${a}>`;<label id="lbl"></label>

Answer 3

您只需连接字符串即可。document.getElementById("lbl").innerHTML = &nbsp;'<img src="' + a +'" \>';

Answer 4

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