使用JS语句,利用for循环的方法创建表格的两种方法
首先去layui官网下载教程示例,在项目中加载layui.css,layui.js,JQuery.js
第一种:
将jsp语句写成字符串的形式,使用document.write()方式输出:
代码如下:
var str = ""; str += "<table class='layui-table'>"; for (var i = 0; i < 6;i++) { str += "<tr>"; for(var j = 0; j < 24;j++){ str += " <td>" + (i + j) + "</td>"; } str += "</tr>"; } str += "</table>"; document.write(str);
效果如图所示:
第二种,创建元素对象:
首先用数组保存变量名,再通过数组保存的变量名来创建元素对象
代码如下:
var tab = document.createElement("table"); tab.className = "layui-table"; document.body.appendChild(tab); var body = document.createElement("tbody"); tab.appendChild(body); //定义存放元素名称的二维数组 var tabletr = new Array(6); for(var i=0;i<6;i++){ tabletr[i]=new Array(); for(var j=0;j<24;j++){ tabletr[i][j]= i + j; } } for(var i = 1;i<7;i++){ tabletr[i] = document.createElement("tr"); body.appendChild(tabletr[i]); for(var j = 1;j<25;j++){ tabletr[i][j] = document.createElement("th"); tabletr[i].appendChild(tabletr[i][j]); } }
效果如图所示:
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步