编辑
核心代码
<!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>列表动态渲染</title> </head> <body> <!-- 请补全JavaScript代码,将预设代码中的"people"数组渲染在页面中。实现下面的列表: 牛油1号 20岁 牛油2号 21岁 牛油3号 19岁 --> <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 dom = ''; for(let i=0; i<people.length; i++){ dom += '<li>'+people[i].name+people[i].age+'岁</li>' } ul.innerHTML = dom // 补全代码</script> </body> </html>
总结
类似于低八十二题 利用dom直接create和innerHtml赋值