js 实现清空table里的值但不改变table结构

最新推荐文章于 2021-10-26 17:12:31 发布

li_yaya

最新推荐文章于 2021-10-26 17:12:31 发布

阅读量1.3k

点赞数

本文链接：https://blog.csdn.net/li_yaya/article/details/11596561

版权


function sakujyo(){

//table 的id
 var tab = document.getElementById("test") ;
 alert(tab.rows.length);
 alert(tab.rows.item(0).cells[0].innerHTML);
 for (var i=0; i < tab.rows.length; i++){
     for (var j=0;j< tab.rows.item(i).cells.length;j++) {
      tab.rows.item(i).cells[j].innerHTML = "";
     }
 }
}

 

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>

<title>下</title>

<style>

.foot {
  width: 100%;
  height: 80px;
  font-size: 16pt;
  line-height: 20px;
  border-right: #c3daf9  1px solid;
  border-top: #c3daf9  1px solid;
  border-left: #c3daf9  1px solid;
  border-bottom: #c3daf9 1px solid;
}

</style>
</head>

<body>

    <table id="test" class="foot" >
      <tr valign='top' style="color:red;">
       <td>
        71
       </td>
       <td>2011/01/11
       </td>
       <td>20:20:00</td>
       <td>
       目黒線</td>
       <td>大岡山１号</td>
       <td>踏切支障</td>
       <td>発生</td>
       </tr>
       <tr valign='top' style="color:blue">
       <td>
       70</td>
       <td>2010/10/01</td>
       <td>20:00:00</td>
       <td>
       目黒線</td>
       <td>大岡山２号</td>
       <td>踏切支障</td>
       <td>回復</td></tr>
       <tr valign='top' style="color:red"><td>
       69</td><td>2011/01/11</td><td>20:20:00</td><td>
       目黒線</td><td>大岡山２号</td><td>踏切支障</td>
       <td>発生</td></tr>
      </table>

   <input type="button" οnclick="sakujyo()">

</body>
</html>