<html>
<head>
<title>Sample code - Traversing an HTML Table with JavaScript and DOM Interfaces</title>
<script>
function start() {
// get the reference for the body
var mybody = document.getElementsByTagName("body")[0];
// creates a <table> element and a <tbody> element
mytable = document.createElement("table");
mytablebody = document.createElement("tbody");
// creating all cells
for(var j = 0; j < 2; j++) {
// creates a <tr> element
mycurrent_row = document.createElement("tr");
for(var i = 0; i < 2; i++) {
// creates a <td> element
mycurrent_cell = document.createElement("td");
// creates a text node
currenttext = document.createTextNode("cell is row "+j+", column "+i);
// appends the text node we created into the cell <td>
mycurrent_cell.appendChild(currenttext);
// appends the cell <td> into the row <tr>
mycurrent_row.appendChild(mycurrent_cell);
}
// appends the row <tr> into <tbody>
mytablebody.appendChild(mycurrent_row);
}
// appends <tbody> into <table>
mytable.appendChild(mytablebody);
// appends <table> into <body>
mybody.appendChild(mytable);
// sets the border attribute of mytable to 2;
mytable.setAttribute("border", "2");
}
</script>
</head>
<body onload="start()">
</body>
</html>
注意：
mytable = document.createElement("table");
mytable=.setAttribute("
cellspacing", "0");
mytable.setAttribute("
cellpadding", "0");
使用 cellSpacing 而不是 cellspacing
使用 cellPadding 而不是 cellpadding
即：
mytable.setAttribute("cellSpacing", "0");
mytable.setAttribute("cellPadding", "0");
分享到：
相关推荐
主要介绍了JavaScript如何动态创建table表格，一些时候需要动态的创建和删除表格，接下来的文章中将为大家介绍下javascript是如何做到的，感兴趣的朋友不要错过
利用纯javascript来实现的动态表格！！！超级实用知识点大概包括，jq、基本dom的获取、创建节点、innerHTML添加内容、js给标签创建属性、动态在表格中添加按钮。
本文档详细描述了,动态生成行,列与行列同时生成的过程.文档中对代码进行了详细的说明! 下载就能用的代码!
var _table=document.createElement("table"); _table.id="table2"; //设置表格属性 _table.setAttribute("border","1"); _table.setAttribute("borderColor","black"); _table.setAttribute(...
使用JavaScript和DOM动态创建表格
介绍了JS动态创建Table,Tr,Td并赋值的具体实现，有需要的朋友可以参考一下
vue 中使用 vxe-table 制作可编辑表格的使用过程 项目上有一个表格需要实现在线编辑，开始用了 element 的el-table 实现，单元格内基础情况就是监听了单击单元格切换一个span标签与input标签，复杂点的单元格使用...
WP-Table Reloaded 允许你在WP的编辑区域创建表格，不需要了解HTML知识。舒服的后台可以让你轻松地编辑表格数据。表格可以包含任何数据类型。表格可以用在文章、数据以及挂件中，还可以导入导出为 CSV，XML，HTML等...
这是chm格式，下载后看不了...HTML作者可以从中学习如何用JavaScript创建动态网页。经验丰富的程序设计者可以从中快速地找到编写复杂JavaScript程序需要的信息。本书对所有JavaScript程序设计者来说都是绝对必要的。
14.3 JavaScript创建二维数组 14.4 截断小数点位数 14.5 删除数组中指定元素 14.6 数字选中后放大 14.7 统计字符数的方法 14.8 JavaScript遍历数组 14.9 获取字符串型数组下标的数组长度 14.10 用JavaScript实现数组...
本文实例讲述了javascript动态创建表格及添加数据的方法。分享给大家供大家参考。具体分析如下： 1. 动态创建表格（代码不兼容IE6） <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta ...
14.3 JavaScript创建二维数组 14.4 截断小数点位数 14.5 删除数组中指定元素 14.6 数字选中后放大 14.7 统计字符数的方法 14.8 JavaScript遍历数组 14.9 获取字符串型数组下标的数组长度 14.10 用JavaScript实现数组...
9.9.html 使用输入对话框修改table的值。 9.10.html 按照要求打开新窗口。 9.11.html 设定重复执行的延时程序。 top.html 框架定义与多框架分离页面时使用的框架头部页面。 left.html 多框架...
我们可以根据需要动态从服务器加载JavaScript脚本来创建和控制UI来与用户交互。下面结合Ext JS来说明如何从服务器上动态加载JS脚本来动态创建窗体。 1 项目结构： 项目结构如下：其中GetJSUI一般处理程序用来从...
Json Table小部件此Flutter软件包提供了一个Json Table小部件，用于直接显示json（Map）中的表。...该表是手动编码的，因此对于如何在flutter中手动创建简单表提供了很好的学习目的。支持垂直和水平滚动。支持c
JQuery动态生成Table表格 主要用到了JQuery中的append和appendto的方法,具体代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html>...
1.js动态生成table,对table的创建，添行，删行操作
表格报告 使用 JavaScript、HTML 和 CSS 从 JSON 创建报告表
该方法创建一个新的 TableRow 对象，表示一个新的 <tr> 标记，并把它插入表中的指定位置。 新行将被插入 index 所在行之前。若 index 等于表中的行数，则新行将被附加到表的末尾。 如果表是空的，则新行将被插入到一...
它使用DOM 1的方法由JavaScript动态创建一个HTML表格。它创建一个由四个包含文本内容的单元格组成的小表格。单元格的文字内容是：“单元格是第y行第x列”，表示单元格在表格中的行数和列数。 代码如下:<ht