javascript 动态创建 table的rows与cells

最新推荐文章于 2021-06-15 17:36:58 发布
最新推荐文章于 2021-06-15 17:36:58 发布
阅读量3.1k 收藏 1
点赞数
文章标签： table javascript border function object html

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>javascript 动态创建 table的rows与cells</title>
</head>
<body>
<table border="1" width="100%" id="tab1">
<tr id="tr1">
<td>标题01</td>
<td>标题02</td>
<td>标题03</td>
</tr>
</table>
</body>
</html>
<script>
var _tab = document.getElementById("tab1") ;
var _tr = document.getElementById("tr1") ;
var arrCellText= Object() ;
arrCellText[0] = "00" ;
arrCellText[1] = "01" ;
arrCellText[2] = "02" ;
createRowCell(_tab, _tr, arrCellText) ;
createRowCell(_tab, _tr, arrCellText) ;
function createRowCell(tab, tr, objCellText)
{
trNew = tab.insertRow(1) ;
for(var i=0; i<tr.cells.length; i++)
{
var tdNew = trNew.insertCell(arrCellText[i]) ;
var tnNew = document.createTextNode(arrCellText[i]) ;
tdNew.appendChild(tnNew) ;
}
}
</script> 
lifuan
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
js获取table的行/列:table.rows[].cells[]
LPF的专栏
12-25 9444
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> --> <!-- 描述：table.row[].cells[]测试 --> 1 2
tab.insertRow()如何加背景颜色css样式
sky_xin的专栏
12-18 507
 function addAttachment(fileName, fileSize){        var tab = document.all("tabAttachment_new");        var oRow = tab.insertRow();        for (i = 0; i &lt; 4; i++){            oRow.insertCell();    ...
js获取table的行数与列数
古老的未来
07-24 6828
转自：http://blog.csdn.net/wangygang/article/details/4531684 http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> http://www.w3.org/1999/xhtml"> 无标题文档 JavaScript" language="javascript">  
js如何操作表格
codeFH的博客
01-16 2169
js如何操作表格（常用属性方法汇总） 1.1 Table 对象集合 cells[] 返回包含表格中所有单元格的一个数组。 语法：tableObject.cells[] rows[] 返回包含表格中所有行的一个数组。 rows 集合返回表格中所有行的一个数组。该集合包括 thead、tfoot 和 tbody 中定义的所有行。 tBodies[] 返回包含表格中所有 tbody 的一个数组。 注：不...
js 中关于table表格的cell，row 的属性的操作
想飞的鱼
06-04 1万+
<br /><html><br /><head><br /><title>添加行</title><br /><script type="text/javascript"><br />function addRow(tb)<br />{<br />    var tb=document.getElementById(tb);<br />    alert(tb.rows(0).cells(0).innerText);<br />    var tbody = tb.childNodes[0];<br />  
javascript 动态table添加colspan\rowspan 参数的方法
12-01
解决方法：取得表对象，并取得他下面对应的行对象下的某个元素，这里如document.tableId.rows[i].cells[j]即取得表下第i行下的第j个元素，然后document.tableId.rows[i].cells[j].colspan=n即可。 eg: dempTHFirst为...
JSP中使用JavaScript动态插入删除输入框实现代码
12-01
JavaScript代码： 代码如下: [removed] function addrows(){ var len = optionlist.rows.length; //得到table的行数 var obj = optionlist.insertRow(len);//在最后一行插入 /**插入第一列**/ obj.insertCell(0); ...
JavaScript动态改变表格单元格内容的方法
12-12
本文实例讲述了JavaScript动态改变表格单元格内容的方法。...var x=document.getElementById('myTable').rows[0].cells; x[0][removed]="NEW CONTENT"; } [removed] </head> <body> <table id="myTabl
javascript 实现简单的table排序及table操作练习
01-21
在这个列子中，练习了table的操作，主要有：tBodies、rows、cells，还有有关数组的排序方法：sort 先上代码： 代码如下: <!DOCTYPE HTML> <html> <head> <meta charset=”utf-8″> <title&...
JS操作table
热门推荐
william zheng的专栏
07-22 1万+
<br />虽然现在前台已经很少用table来布局了，但是有的地方还是会难免的用到table，比如表单，或者其他的列表，用table肯定比div来的方便，那么，用table的话要加上js来实现一些效果，比如删除一行，添加一行，所以，有必要好好熟悉一下js对table的操作，<br />首先要获得table对象，有很多方法，<br />通过ID，table = document.getElementById()来获得<br />通过CLASS，table = document.getElementsByCla
html表格中rows设置什么的,原生js操作Table元素的方法,使用insetRow,insertCell
weixin_31478029的博客
06-15 700
table的操作方法我们先看一下table都有哪些属性和方法，table在页面中叫做HTMLTableElement。table有几个跟操作table，tr，td的方法。table的操作方法table.insertRow([index])-插入一个tr。tr.insertCell(index)-插入一个td。table.createCaption()-table内创建一个table标题。table...
js中的rows和cells的使用
04-27 3167
在使用JS时，经常会使用操作DOM树的方法来实现对HTML页面的修改，但在读取表格控件时，有一种简单的方法，就是通过获取tbody对象，此对象将行列的操作，作为二维数组来操作。从网络中找到了些描述：Table下面可以有thead和tbody两个分组对象，某些时候可以代替div使用，比如实现某部份表格隐藏。tr是行，th或者td是列，这些对象构成表格阵列每一个...就是我们所说得rows[i
JS中的rows和cells
peppa_pig的博客
02-26 7632
rows集合返回表格中所有行的一个数组； cells集合返回表格中所有单元格的一个数组。 语法 tableID.rows[rowsIndex] tableID.cells[cellsIndex] 例如： var x=document.getElementById('table1').rows[0].cells[0].innerHTML; // 显示出第一个单元格的内容。 ...
关于js中的rows&cells
gridplatform的专栏
03-05 4209
定义和用法<br />cells 集合返回表格中所有单元格的一个数组。rows 集合放回表格中所有行的一个数组.语法tableObject.cells[]<br /> tableObject.rows[]实例<br />下面的例子使用 cells 来显示出第一个单元格的内容：<html><br /> <head><br /> <script type="text/javascript"><br /> function GetCellText()<br /> {<br /> var x=d
Table cells 集合
Vipwxs的博客
01-19 691
Table cells 集合  Table 对象 定义和用法 cells 集合返回表格中所有 或 元素。 语法 tableObject.cells 属性 属性 描述 length 返回集合中 或 元素的数目。 方法 方法 描述 [name_or_i
JavaScript获取table表格内元素的内容
最新发布
05-22
var rows = table.getElementsByTagName("tr"); // 遍历行 for (var i = 0; i < rows.length; i++) { // 获取当前行的所有单元格 var cells = rows[i].getElementsByTagName("td"); // 遍历单元格 for (var j...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值