老师，帮解释一下
来源：3-11 【拓展】动态获取元素
慕尼黑1646658
2023-07-12 15:33:00
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<ul id="list">
<li class="liEle">oldli</li>
<li class="liEle">oldli</li>
<li class="liEle">oldli</li>
<li class="liEle">oldli</li>
<li class="liEle">oldli</li>
</ul>
<script>
// 获取ul元素
var listEle = document.getElementById("list")
// 通过getElementsByTagName方法获取元素
var lis = document.getElementsByTagName("li")
// 没有利用循环生成li之前打印lis
console.log(lis)
// 通过循环，生成5个li标签，类名为liEle，内容为new li，生成之后，放在ul里面
for (var i = 0; i < 5; i++) {
var newli = document.createElement("li");
newli.className = "liEle"
newli.innerHTML = "new li"
listEle.appendChild(newli)
}
// 利用循环生成li之后打印lis
console.log(lis)
</script>
</body>
</html>
写回答
1回答
-
好帮手慕久久
2023-07-12
同学你好，这是控制台的显示问题。第一次console执行时，页面上只有5个li，所以输出如下（图一）：
但是下面代码，又改变了li个数，控制台就只能在展开形式中，将新的li填进去了（图二）：
同学不要看图二”，看图一就行了。
祝学习愉快！
0
相似问题