内置浏览器对象

最新推荐文章于 2024-07-14 13:21:09 发布

是梦么

最新推荐文章于 2024-07-14 13:21:09 发布

阅读量59

点赞数

文章标签： servlet java html

本文链接：https://blog.csdn.net/m0_73819271/article/details/127087564

版权

<!DOCTYPE html>
<html>
   <head>
       <meta charset="utf-8">
       <title></title>
       <style type="text/css">
           #tab{
               border: 1px solid red;
               border-collapse: collapse;
           }th,td{
               border: 1px solid red;
               text-align: center;
           }
       </style>
   </head>
   <body>
       <table id="tab" width="200" border="" cellspacing="" cellpadding="">
           <thead>
               <tr>
                   <th>学号</th>
                   <th>姓名</th>
                   <th>性别</th>
               </tr>
           </thead>

           <tbody>

           </tbody>
       </table>
       <script type="text/javascript">
           var data=[{
               stuid:1001,
               stuname:"张三",
               stusex:"男"
           },{
               stuid:1002,
               stuname:"李四",
               stusex:"男"
           },{
               stuid:1003,
               stuname:"小红",
               stusex:"女"
           }]
           window.οnlοad=function(){
               for(var i=0;i<data.length;i++){
                   var stuid=data[i].stuid
                   var stuname=data[i].stuname
                   var stusex=data[i].stusex
                   //创建td
                   var td_1=document.createElement("td")
                   var td_2=document.createElement("td")
                   var td_3=document.createElement("td")
                   //将学号,姓名,性别添加到td中
                   td_1.innerHTML=stuid
                   td_2.innerHTML=stuname
                   td_3.innerHTML=stusex
                   //创建一个tr标签
                   var tr= document.createElement("tr")

                   //将td标签添加到tr中
                   tr.appendChild(td_1)
                   tr.appendChild(td_2)
                   tr.appendChild(td_3)
                   //将tr添加到tbody中
                   document.querySelector("tbody").appendChild(tr)
               }
           }
       </script>
   </body>
</html>