其他分享
首页 > 其他分享> > js循环添加table数据

js循环添加table数据

作者：互联网

<body>
    <table border="1">
        <thead>
        <tr>
            <th>姓名</th>
            <th>年龄</th>
            <th>性别</th>
        </tr>
        </thead>
        <tbody id="test">
        </tbody>
    </table>
    <script type="application/javascript">
        var list=[{id:1,name:"zhangsna",sex:"0"},{id:2,name:"lisi",sex:"0"}];
        for(var datalist in list){
            //每次循环创建一个tr，实现换行
            var trval = document.createElement("tr")
            //获取字典中的数组
            var data = list[datalist];
            for(var info in data){
                //创建td标签
                var tdval = document.createElement("td")
                //获取每次循环的值[id，name，sex]]
                var text = data[info]
                //将获取的值绑定到td标签上
                tdval.innerText = text
                //将td标签绑定到tr上
                trval.appendChild(tdval)
            }
            var bodyTag = document.getElementById("test")
            //将tr标签绑定到tbody上
            bodyTag.appendChild(trval)
        }
    </script>
</body>

标签：标签,tr,js,添加,trval,var,table,td,sex
来源： https://www.cnblogs.com/whtjyt/p/16369911.html