欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

javascript 動態(tài)添加表格行

 更新時間:2006年06月22日 00:00:00   作者:  
表格部分代碼如下:

<table id="testTbl" border=1>

<tr id="tr1">

<td width=6%><input type=checkbox id="box1"></td>

<td id="b">第一行</td>

</tr>

<tr id="tr2">

<td width=6%><input type=checkbox id="box2"></td>

<td id="b">第二行</td>

</tr>

<tr bgcolor=#0000FF>

<td width=6%><input type=checkbox id="box3"></td>

<td>第三行</td>

</tr>

</table>

動態(tài)添加表行的javascript函數(shù)如下:

function addRow(){

//添加一行

var newTr = testTbl.insertRow();

//添加兩列

var newTd0 = newTr.insertCell();

var newTd1 = newTr.insertCell();

//設(shè)置列內(nèi)容和屬性

newTd0.innerHTML = '<input type=checkbox id="box4">';

newTd2.innerText= '新加行';

}

就這么簡單,做點詳細的說明:

1、inserRow()insertCell()函數(shù)

insertRow()函數(shù)可以帶參數(shù),形式如下:

insertRow(index)

這個函數(shù)將新行添加到index的那一行前,比如insertRow(0),是將新行添加到第一行之前。默認的insertRow()函數(shù)相當于insertRow(-1),將新行添加到表的最后。

insertCell()insertRow的用法相同。

2、動態(tài)設(shè)置屬性和事件

上面行數(shù)中的innerHTML和innerText都是列的屬性。

這個inner,就是“inner”到<tb></tb>之間,innerText是添加到<tb></tb>之間的文本,innerHTML是添加到<tb></tb>之間的HTML代碼(這個so簡單,這個解釋挺多余的)

設(shè)置其他屬性也是用同樣的方式,比如,設(shè)置行背景色

newTr.bgColor = 'red';

 

設(shè)置事件也一樣,需要簡單說明一點。

比如,我要讓點擊新加行的時候執(zhí)行一個自己定義的函數(shù) newClick,newClick行數(shù)如下:

function newClick(){

alert("這是新添加的行");

onclick事件設(shè)置這個函數(shù)的代碼如下:

newTr.onclick = newClick;

這里需要主義的是,=后面的部分必須是函數(shù)名,而且不能帶引號,

newTr.onclick = newClick();

newTr.onclick = 'newClick';

newTr.onclick = "newClick";

上面的寫法都是錯誤的。

為什么,其實知道為什么沒有什么意思,知道怎么用就OK了,如果不想知道,可以跳過下面這一段。

 

實際上這個=后面的newClick是指向自己定義的newClick函數(shù)的指針,javascript里面函數(shù)名就是指向函數(shù)的指針,加了引號括號什么的瀏覽器就找不到那個函數(shù)了。

下面的寫法,也是正確的

newTr.onclick = function newClick(){

alert("這是新添加的行");

這個使用函數(shù)名實際上是一樣的

 

設(shè)置其他的事件用法相同。

相關(guān)文章

最新評論