如何在Javascript HTML文件中显示图像？

Question

我从https://github.com/huzaifsayed/coronabot-chatterbot的index.html页面中获得了以下代码：

 function appendMessage(name, img, side, text) {
      //   Simple solution for small apps
      const msgHTML = `
<div class="msg ${side}-msg">
  <div class="msg-img" style="background-image: url(${img})"></div>

  <div class="msg-bubble">
    <div class="msg-info">
      <div class="msg-info-name">${name}</div>
      <div class="msg-info-time">${formatDate(new Date())}</div>
    </div>

    <div class="msg-text">${text}</div>
    
  </div>
</div>

Answer 1

应该在url周围插入Qoutes。背景图像的语法如下所示

<div class="msg-img" style="background-image: url('paper.jpg')"></div>

因此，要在代码中实现这种语法，需要用引号将插值部分括起来。由于已经在使用双QOUTE，因此可以在url周围使用单QOUTE。试试这个：-

<div class="msg-img" style="background-image: url('${img}')"></div>