题解 | #列表动态渲染#
列表动态渲染
https://www.nowcoder.com/practice/347e2e88f11a4b0c89157568f26ea126
JS11 列表动态渲染
描述
请补全JavaScript代码，将预设代码中的"people"数组渲染在页面中。实现下面的列表：
- 牛油1号 20岁
- 牛油2号 21岁
- 牛油3号 19岁
<!DOCTYPE html>
<html lang="en"><head>
<meta charset="UTF-8">
</head>
<body>
<ul></ul>
<script>
var people = [
{ name: '牛油1号', id: 1, age: 20 },
{ name: '牛油2号', id: 2, age: 21 },
{ name: '牛油3号', id: 3, age: 19 },
]
var ul = document.querySelector('ul');
// 补全代码
let i=0;
while(i<people.length){
ul.innerHTML += `<li>${people[i].name} ${people[i].age}岁</li>`
i++
}
</script>
</body>
</html>
#渲染#