javascript - 使用 javascript 添加时图像不显示

Question

for(let n=0; n<5; n++){
  var elm = document.createElement('div');
  elm.setAttribute('class',"comments");
  document.getElementById('elm').appendChild(elm);

  var sec = document.createElement('div');
  sec.setAttribute('class', "sec");
  elm.appendChild(sec);

  var LPimg = new Image(); //document.createElement('img');
  LPimg.src = "C:\Users\Lenovo\Downloads\hacker8.jpeg";
  LPimg.setAttribute('class', "LP1");
  sec.appendChild(LPimg);
}

#elm{
          width: 90vw;
          height: 90vh;
          background: blue;
       }
       .comments{
         background: brown;
         width: 100%;
         height: 150px;
         border: 2px solid yellow;
       }
       .sec{
          width: 50px;
          height: 50px;
          background: chartreuse;
          z-index: 1000;
          border: 2px solid darkgreen;
       }

<div id="elm"></div>

在此代码中，我在 .sec 类中添加了一个 img，但图像不起作用，如何解决此问题？

注意:图像路径有效。它适用于其他情况，我的意思是当我在 HTML 中添加相同的 img 时，它可以工作。

Answer 1

您需要为图像使用相对路径，而不是绝对路径。

您可以将图像与 html 文件复制到同一文件夹并使用

LPimg.src = "hacker8.jpeg";

或者放入与html文件同级的images文件夹中并使用

LPimg.src = "images/hacker8.jpeg";