jquery创建table

jsp：
<body>
<div id="show"></div>
</body>
想动态创建个表格，并把表格写入div中，目前是：var htmlStr = "<table border=1>";
htmlStr += "<tr>";
htmlStr += "<th>";
htmlStr += "id";
htmlStr += "</th>";
htmlStr += "<th>";
htmlStr += "name";
htmlStr += "</th>";
htmlStr += "<th>";
htmlStr += "age";
htmlStr += "</th>";
htmlStr += "<th>";
htmlStr += "sex";
htmlStr += "</th>";
htmlStr += "</tr>";
htmlStr += "</table>";
$("#show").html(htmlStr);
如果是个复杂的表格，那就很麻烦了，希望大家能指点下，谢谢！

解决方案 »

  1.   

    jquery 里面有个append方法，可以把html标签加进去
      

  2.   

    不是还要写全吗？我想了解jquery中有没有类似于document.createElement("<table>");这样的呢？
      

  3.   


    var htmlStr = "<table border=1>";    
    htmlStr += "<tr>";
    htmlStr += "<th>";
    htmlStr += "id";
    htmlStr += "</th>";
    htmlStr += "<th>";
    htmlStr += "name";
    htmlStr += "</th>";
    htmlStr += "<th>";
    htmlStr += "age";
    htmlStr += "</th>";
    htmlStr += "<th>";
    htmlStr += "sex";
    htmlStr += "</th>";
    htmlStr += "</tr>";
    htmlStr += "</table>";
    $("#show").append(htmlStr);
      

  4.   

    $('<table />').appendTo('#show');
      

  5.   


    <body>
    <div id="show"></div>
    </body>
    var htmlStr = "<table border=1><tr><th>id</th><th>";
    htmlStr += "name</th><th>age</th><th>sex</th></tr></table>";
    $("#show").html(htmlStr);//这种就是拼字符串的orvar tab = $("table");
    var tr = $("tr");
    var td = $("td");
    td.text("id");
    var td2 = $("td");
    td2.text("年龄");
    var td3 = $("td");
    td3.text("名称");
    tr.append(td);
    tr.append(td2);
    tr.append(td3);
    tab.append(tr);
    $("#show").append(tab);or
    var htmlStr = "<table border=1><tr><th>id</th><th>";
    htmlStr += "name</th><th>age</th><th>sex</th></tr></table>";
    $("#show").append(htmlStr);还有appendTo、clone克隆，可以dom对象及事件
    jquery的dom操作比较灵活，lz可以看需要运用
      

  6.   

    $("table>tr:last").clone(true).appendTo($("#"));
      

  7.   


    其实jQuery中$("<table></table>")这就是创建标签的语法，就是#5楼所说的那样的
      

  8.   

    对Jquery完全不清楚怎么回事，学习中
      

  9.   

    var table = new Element('table',{"class":"TableList","width":"100%"}).update("<tr class='TableControl'><td width='100%' colspan='3'>
    <input type='checkbox' name='allbox' id='allbox' onClick='checkAll();'>
    全选&nbsp;<input type='button'  value=' 汇总打印  ' class='BigButton' onClick='printMail();' title='汇总打印'></td></tr>");
    $('giftList').appendChild(table);<body>
    <div id="giftList"></div>
    </body>