图像不附加到

问题描述 投票:2回答:2

我正在创建一个简单的图像列表。

HTML

<body onload="getImg()">
</body>

JavaScript的

function getImg() {
  var list = document.createElement("ul");
  list.className = "img-list";
  for (i = 0; i < 32; i++) {
      var img = document.createElement("img");
      var item = document.createElement("li");
      path = "images/DT/"+i+".png";
      img.src = path;
      img.alt = "something";
      item.appendChild(img);
      list.appendChild(item);
  }
console.log(list);
window.alert(list.innerHTML);
}

然后在控制台中,似乎我有列表显示但不知何故图像没有显示在网页中。蚂蚁的想法是怎么回事?

javascript html
2个回答
1
投票
document.body.appendChild(list);

仍然缺失。

function getImg() {
  var list = document.createElement("ul");
  list.className = "img-list";
  for (i = 0; i < 32; i++) {
    var img = document.createElement("img");
    var item = document.createElement("li");
    path = "images/DT/" + i + ".png";
    img.src = path;
    img.alt = "something";
    item.appendChild(img);
    list.appendChild(item);
  }
  document.body.appendChild(list);
}
<body onload="getImg()"></body>

暗示

代码必须在<head>

<head>
  <script>...</script>
</head>
<body onload="getImg()">...</body>

0
投票

试试这个:Js:

<script>
    function getImg() {
        var list = document.createElement("ul");
        list.className = "img-list";
        for (i = 0; i < 2; i++) {
            var img = document.createElement("img");
            var item = document.createElement("li");
            path = "images/DT/" + i + ".png";
            img.src = path;
            img.alt = "something";
            item.appendChild(img);
            list.appendChild(item);
        }
        console.log(list);
        document.getElementById("page").innerHTML = list.innerHTML;
    }
</script>

HTML:

<body id="page" onload="getImg()"></body>
© www.soinside.com 2019 - 2024. All rights reserved.