zoukankan      html  css  js  c++  java
  • 创建表格的方法

    1.字符串的的拼接

    function createTable (rows,cols){
    var html = "<table>";
    for(var i = 0;i<rows;i++){
    html+="<tr>";
    for(var j = 0;j<cols;j++){
    html+="<td style = 'border:1px solid red; padding:5px 30px;'>"+rows+"行"+cols+"列"+"</td>"
    }
    html+="</tr>"
    }

    html += "<table>";
    oDiv.innerHTML = html;

    2.创建追加节点

    function createTable (rows,cols){
    var fragment=document.createDocumentFragment();//创建文档碎片
    var cTable = document.createElement("table");
    for(var i = 0;i<rows;i++){
    var cTr = document.createElement("tr");
    for(var j = 0;j<cols;j++){
    var cTd = document.createElement("td");
    cTd.style.cssText = "padding: 5px 30px; border: 1px solid red;";
    cTd.innerHTML = "111111";
    cTr.appendChild(cTd);
    }
    cTable.appendChild(cTr);
    }
    fragment.appendChild(cTable);
    oDiv.appendChild(fragment);

    }

    3.

    <table border="1">

    </table>

    var oTable=document.getElementsByTagName('table')[0];
    //alert(oTable.rows.length);//获取行
    //alert(oTable.rows[0].cells.length);
    //insertRow(index); //insertRow() 方法用于在表格中的指定位置(index)插入一个新行。
    //insertCell(index);//方法用于在 HTML 表的一行的指定位置插入一个空的 <td> 元素。
    //deleteRow(); 方法用于从表格删除指定位置的行。
    //deleteCell();
    var oTr=null;
    var oTd=null;
    for(var i=0;i<10;i++){
    oTr=oTable.insertRow(i);//i:第几行
    for(var j=0;j<10;j++){
    oTd=oTr.insertCell(j);
    oTd.innerHTML='1111111111'+j;
    }
    }

  • 相关阅读:
    centos-docker安装及基本使用
    List集合-03.Vector
    List集合-02.LinkedList
    List集合-01.ArrayList
    常用图像处理方法
    git使用
    bug记录
    bash vim等常用命令
    python常用
    MTCNN试用
  • 原文地址:https://www.cnblogs.com/sun765/p/7772869.html
Copyright © 2011-2022 走看看