如何获取存储在 javascript 变量中的图像，以显示在 HTML 代码中？

Question

例如，我的图像存储在一个名为 flowers 的变量中，如以下 javascript 代码所示：

<script>
     var flowers = "myFlowers.gif";
</script>

在下面的 HTML 代码中，我在 img src 中引用了 flowers 变量以显示图像，但似乎无法正常工作。

<img src= flowers  class="card-img-top" id="flowers">

请帮忙，我做错了什么？

Answer 1

不能这样直接插入。相反，您通过 javascript.

设置属性 src

let flowers = "https://picsum.photos/200/300";
document.querySelector('#flowers').src = flowers;

<img  class="card-img-top" id="flowers">

How do I get an image stored in a javascript variable, to display in an HTML code?