zoukankan      html  css  js  c++  java
  • Table表格的一些操作

    首先创建一个table表格:

     1 <input type="button" id="btn1" value="获取数据" />
     2 <table id="tab1" border="1" >
     3     <thead>
     4         <tr>
     5             <td>编号</td>
     6             <td>姓名</td>
     7             <td>年龄</td>
     8         </tr>
     9     </thead>
    10     <tbody>
    11         <tr>
    12             <td>1</td>
    13             <td>DD</td>
    14             <td>23</td>
    15         </tr>
    16         <tr>
    17             <td>2</td>
    18             <td>AA</td>
    19             <td>33</td>
    20         </tr>
    21         <tr>
    22             <td>3</td>
    23             <td>CD</td>
    24             <td>54</td>
    25         </tr>
    26         <tr>
    27             <td>4</td>
    28             <td>VD</td>
    29             <td>32</td>
    30         </tr>
    31     </tbody>
    32 </table>
    table表格

    通过js获取表格里每个单元格的值:

    1     window.onload=function(){
    2             var oBtn=document.getElementById('btn1');
    3             oBtn.onclick=function(){
    4                 var oTab=    document.getElementById('tab1');
    5                 var value=    oTab.getElementsByTagName('tbody')[0].getElementsByTagName('tr')[0].getElementsByTagName('td')[2].innerHTML;
    6                 alert(value);
    7             }
    8     }
    这是又臭又长的写法

    后来程序猿们把他改进了,通过table的对象集合就能取到了单元格的值:

    1     window.onload=function(){
    2             var oBtn=document.getElementById('btn1');
    3             oBtn.onclick=function(){
    4                 var oTab=    document.getElementById('tab1');
    5                 var value=oTab.tBodies[0].rows[0].cells[2].innerHTML;
    6                 alert(value);
    7             }
    8     }
    这个看起来就舒服多了

    参考:http://www.w3school.com.cn/htmldom/dom_obj_table.asp

  • 相关阅读:
    【Docker】命令 start
    【Docker】命令 create
    【Docker】命令 docker
    【Docker】命令 pull
    【Docker】命令 search
    【Docker】命令 info
    【Docker】命令 version
    Java常用类——Random类
    Java常用类——BigInteger& BigDecimal
    Java常用类——Math类
  • 原文地址:https://www.cnblogs.com/Mryjp/p/table.html
Copyright © 2011-2022 走看看