javascript动态添加单元格的脚本代码
更新时间:2007年11月24日 12:33:12 作者:
如何动态添加单元格!!
用insertRow()和insertCell()方法
其用法如下:
insertRow()
var newTR=TableOBJ.insertRow(N);
其中N表示插入到第几行!
说明:当N=0时,插入到最上面一行!当N=-1时插入到最后一行,相当省略该参数!
insertCell()
var newTD=TrOBJ.insertCell(N);
其中N表示插入到第几列!
说明:当N=0时,插入到最上面一行!当N=-1时插入到最后一行,相当省略该参数!
下面为一实例代码:
<script language="JavaScript">
var Count=false,NO=1;
function addRow(){
Count=!Count;
//添加一行
var newTr = testTbl.insertRow();
//添加三列
var newTd0 = newTr.insertCell();
var newTd1 = newTr.insertCell();
var newTd2 = newTr.insertCell();
//设置列内容和属性
if(Count){newTr.style.background="#FFE1FF";}
else {newTr.style.background="#FFEFD5";}
newTd0.innerHTML = '<input type=checkbox id="box4">';
NO++
newTd1.innerText="第"+ NO+"行";
}
</script>
[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]
复制代码 代码如下:
用insertRow()和insertCell()方法
其用法如下:
insertRow()
复制代码 代码如下:
var newTR=TableOBJ.insertRow(N);
复制代码 代码如下:
其中N表示插入到第几行!
说明:当N=0时,插入到最上面一行!当N=-1时插入到最后一行,相当省略该参数!
insertCell()
复制代码 代码如下:
var newTD=TrOBJ.insertCell(N);
其中N表示插入到第几列!
说明:当N=0时,插入到最上面一行!当N=-1时插入到最后一行,相当省略该参数!
下面为一实例代码:
复制代码 代码如下:
<script language="JavaScript">
var Count=false,NO=1;
function addRow(){
Count=!Count;
//添加一行
var newTr = testTbl.insertRow();
//添加三列
var newTd0 = newTr.insertCell();
var newTd1 = newTr.insertCell();
var newTd2 = newTr.insertCell();
//设置列内容和属性
if(Count){newTr.style.background="#FFE1FF";}
else {newTr.style.background="#FFEFD5";}
newTd0.innerHTML = '<input type=checkbox id="box4">';
NO++
newTd1.innerText="第"+ NO+"行";
}
</script>
[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]
相关文章
JavaScript使用SpreadJS创建Excel查看器
在现代的Web应用开发中,Excel文件的处理和展示是一项常见的需求,小编今天将为大家展示如何借助SpreadJS来创建一个Excel查看器,感兴趣的小伙伴可以了解下2023-12-12JavaScript中rxjs与 Observable 两大类操作符解析
这篇文章主要介绍了JavaScript中rxjs与 Observable 两大类操作符解析,运算符是对 Observable 进行操作并返回 Observable 的函数,文章围绕主题展开详细内容,需要的小伙伴可以参考一下2022-07-07JavaScript事件学习小结(五)js中事件类型之鼠标事件
这篇文章主要介绍了JavaScript事件学习小结(五)js中事件类型之鼠标事件的相关资料,非常不错具有参考借鉴价值,需要的朋友可以参考下2016-06-06
最新评论