最简单的jQuery创建表格

最新推荐文章于 2024-07-31 15:52:50 发布

huaying.chen

最新推荐文章于 2024-07-31 15:52:50 发布

阅读量1.4w

点赞数 9

分类专栏： Oscar_js 文章标签： jquery createtable append 标签 html

本文链接：https://blog.csdn.net/crave_shy/article/details/17223245

版权

Oscar_js 专栏收录该内容

11 篇文章 0 订阅

订阅专栏

最简单的jQuery创建表格

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

HTML代码：

<!DOCTYPE html>
<HTML>
 <HEAD>
  <TITLE> dynamic create table </TITLE>
  
  <script type="text/javascript" src="jquery-1.7.2.min.js"></script>
  <SCRIPT type="text/javascript" >
      function createTable(rowNum,clomnNum){
      		var table = $("<table border = \"1\" >");
      			table.appendTo(($("#createTable")));
      			for(var i=0;i<rowNum;i++){
      				var tr=$("<tr></tr>");
      					tr.appendTo(table);
      					for(var j=0;j<clomnNum;j++){
      						var td=$("<td>" + i*j + "</td>");
      							td.appendTo(tr);
      					}
      			}
	 		$("#createTable").append("</table>");	
      }     	
  </SCRIPT>
 </HEAD>

<BODY>
	<input type="button" value="create" οnclick="createTable(5,6)"/>
	</br>
	<div id="createTable"></div>
 </BODY>
</HTML>