Heim > Web-Frontend > js-Tutorial > javascript动态添加单元格的脚本代码_javascript技巧

javascript动态添加单元格的脚本代码_javascript技巧

WBOY
Freigeben: 2016-05-16 19:07:35
Original
1186 Leute haben es durchsucht

如何动态添加单元格!!

复制代码 代码如下:

用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> <BR>var Count=false,NO=1; <BR>function addRow(){ <BR>Count=!Count; <BR>//添加一行 <BR>var newTr = testTbl.insertRow(); <BR>//添加三列 <BR>var newTd0 = newTr.insertCell(); <BR>var newTd1 = newTr.insertCell(); <BR>var newTd2 = newTr.insertCell(); <BR>//设置列内容和属性 <BR>if(Count){newTr.style.background="#FFE1FF";} <BR>else {newTr.style.background="#FFEFD5";} <BR>newTd0.innerHTML = '<input type=checkbox id="box4">'; <BR>NO++ <BR>newTd1.innerText="第"+ NO+"行"; <BR>} <BR></script> 

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage