我正在创建一个简单的图像列表。
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);
}
然后在控制台中,我似乎显示了列表,但不知何故图像没有显示在网页中。 Ant 知道发生了什么事吗?
最佳答案
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>
关于javascript - 图片不附加到 <body>,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47856654/