zoukankan      html  css  js  c++  java
  • HTML DOM Table 对象

    Table 对象集合

    集合描述
    cells[] 返回包含表格中所有单元格的一个数组。
    rows[] 返回包含表格中所有行的一个数组。
    tBodies[] 返回包含表格中所有 tbody 的一个数组。
    <body>
      <table width="500" border="1" id="tab">
         <tr>
            <td>我是单元格1</td><td>我是单元格2</td><td>我是单元格3</td>
         </tr>
         <tr>
            <td>我是单元格4</td><td>我是单元格5</td><td>我是单元格6</td>
         </tr>
           <tr>
            <td>我是单元格7</td><td>我是单元格8</td><td>我是单元格9</td>
         </tr>
      </table>
      <script>
       //获取table对象引用
        var tab = document.getElementById('tab');
        //获取表格行数
        var rows = tab.rows.length;
        var cells;
        
        for(var i=0; i<rows; i++){
            //获取当前行的单元格数
            cells = tab.rows[i].cells.length;
            for(var j=0; j<cells; j++){
                //更新指定单元格中的数据
                tab.rows[i].cells[j].innerHTML +=" " +i+"*"+j;
            }
        }
      </script>
    </body>

     表格table、行rows、单元格cells

    tr和td对象的创建

    <script>
       var tab = document.createElement("table");
       tab.width = 500;
       tab.border = 1;
       tab.id = "tab";
       
       var row,cell;
       for(var i=0; i<3; i++){
    	 //为表插入行
    	 row = tab.insertRow(-1);
    	 for(var j=0; j<3; j++){
    		 //为行插入单元格
    		 cell = row.insertCell(-1);
    		 cell.innerHTML = "我是单元格"+i+"*"+j;
    	 }
       }
       
       //插入DOM树中
       document.body.appendChild(tab);
    

      

  • 相关阅读:
    jaxb解析xml工具类
    JQuery的父、子、兄弟节点查找方法
    jw player 配置参数
    jQuery判断当前元素是第几个元素&获取第N个元素
    正则表达式中test,match,exec区别
    php常用函数file
    php常用函数time
    php常用array函数
    php常用string函数
    Linux常用命令
  • 原文地址:https://www.cnblogs.com/LJJ1010/p/4512263.html
Copyright © 2011-2022 走看看