最简单的jQuery创建表格


最简单的jQuery创建表格


        利用jQuery创建表格、主要是用到jQuery的两个方法:appendTo($("#nodeId"))、append(“html”) 、先使用jQuery创建一个表格头var table = $("<table border = \"1\" >");然后将此变量追加到页面放置此table的地方、然后再创建tr、将tr追加到table上、再创建td、将td追加到tr上、、、最后添加表格的结束标签$("#createTable").append("</table>");


HTML代码:


[html] view plain copy print ?
  1. <!DOCTYPE html>  
  2. <HTML>  
  3.  <HEAD>  
  4.   <TITLE> dynamic create table </TITLE>  
  5.     
  6.   <script type="text/javascript" src="jquery-1.7.2.min.js"></script>  
  7.   <SCRIPT type="text/javascript" >  
  8.       function createTable(rowNum,clomnNum){  
  9.             var table = $("<table border = \"1\" >");  
  10.                 table.appendTo(($("#createTable")));  
  11.                 for(var i=0;i<rowNum;i++){  
  12.                     var tr=$("<tr></tr>");  
  13.                         tr.appendTo(table);  
  14.                         for(var j=0;j<clomnNum;j++){  
  15.                             var td=$("<td>" + i*j + "</td>");  
  16.                                 td.appendTo(tr);  
  17.                         }  
  18.                 }  
  19.             $("#createTable").append("</table>");   
  20.       }           
  21.   </SCRIPT>  
  22.  </HEAD>  
  23.   
  24. <BODY>  
  25.     <input type="button" value="create" onclick="createTable(5,6)"/>  
  26.     </br>  
  27.     <div id="createTable"></div>  
  28.  </BODY>  
  29. </HTML> 

你可能感兴趣的:(最简单的jQuery创建表格)