如何动态的创建行和列？

想要个动态创建多行多列的例子 （js）

解决方案 »

  1.   

    Javascript对HTML标签进行面向对象的包装我以前做的封装，你可以借鉴下，面向对象的包装
      

  2.   

    你自己再对td,tr,tbody,table进行包装，就可以动态生产了
      

  3.   

    <div id="result"></div>

    <script language="javascript" type="text/javascript">
    function getDataTable()
    {
    DataTableService.GetDataTable(onSucceeded, onFailed);
    }

    function onSucceeded(result)
    {
    // alert(result);
    var sb = new Sys.StringBuilder("<table border='1'>");
    sb.append("<tr><td>ID</td><td>Text</td></tr>");
    for (var i = 0; i < result.rows.length; i++)
    {
    sb.append(
    String.format(
    "<tr><td>{0}</td><td>{1}</td></tr>",
    result.rows[i]["ID"],
    result.rows[i].Text));
    }
    sb.append("</table>");

    $get("result").innerHTML = sb.toString();
    }

    function onFailed(error)
    {
    alert(error.get_message());
    }
    </script>
      

  4.   

    不用包装的咋做？就是直接create的就可以
      

  5.   

    <%@ Page Language="C#" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><script runat="server"></script><html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
            <input id="Button1" type="button" value="Draw3*4" onclick="CreateTable()" />
            <script type="text/javascript">
                function CreateTable() {
                    var tbl = document.createElement("table");
                    tbl.border = 1;
                    tbl.width = 300;
                    var tbody = document.createElement("tbody");                
                    var row, col, txt;
                    for (var r = 0; r < 3; r++) {
                        row = document.createElement("tr");
                        for (var c = 0; c < 4; c++) {
                            col = document.createElement("td");
                            txt = document.createTextNode(r + "" + c);
                            col.appendChild(txt);
                            row.appendChild(col);
                        }
                        tbody.appendChild(row);
                    }
                    tbl.appendChild(tbody);
                    document.body.appendChild(tbl);
                }
            </script>
        </div>
        </form>
    </body>
    </html>