题解 | #列表动态渲染#

列表动态渲染

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>
#渲染#
全部评论

相关推荐

评论
点赞
收藏
分享
牛客网
牛客企业服务