|
程序說明
【克隆table】
克隆一個元素用cloneNode就可以了，它有一個bool參數(shù)，表示克隆是否包含子節(jié)點。程序第一步就是克隆原table：
this._oTable = $(table);//源table
this._nTable = this._oTable.cloneNode(false);//新table
this._nTable.id = "";//避免id沖突
要注意雖然ie的cloneNode參數(shù)是可選的（默認是false），但在ff是必須的，建議使用時都寫上參數(shù)。
還要注意的是id屬性也會被克隆，也就是克隆后會有兩個相同id的元素（如果克隆對象有設置的話），這很容易會導致其他問題，程序會把克隆table的id屬性設空。
ps：table請用class來綁定樣式，用id的話新table就獲取不了樣式了。
克隆之后再設置樣式：
this._style.width = this._oTable.offsetWidth + "px";
this._style.position = isIE6 ? "absolute" : "fixed";
this._style.zIndex = 100;
一般來說offsetWidth是width+padding+border的結果，但table比較特別，測試下面的代碼：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<html xmlns="<body>
<table border="5" id="t" style="padding:10px; width:100px;">
<tr>
<td>1</td>
<td>1</td>
</tr>
</table>
<table width="100" id="t2" style="border:10px solid #000;">
<tr>
<td>1</td>
<td>1</td>
</tr>
</table>
<script>
alert(document.getElementById("t").offsetWidth);
alert(document.getElementById("t2").offsetWidth);
</script>
</body>
</html>
只要給table設置width（style或本身的width屬性），不管設置padding和border是多少，offsetWidth都等于width的值。
經(jīng)測量offsetWidth是沒錯的，那就是說是table的width設置的問題。
w3c的table部分 中說width屬性是the desired width of the entire table，我估計entire就是包含了padding和border，找不到什么其他說明，先這么理解吧。
定位方面，除了不支持fixed的ie6用absolute，其他都使用fixed定位。
出處：藍色理想
責任編輯：bluehearts
上一頁 JavaScript Table行定位效果 [1] 下一頁 JavaScript Table行定位效果 [3]
◎進入論壇網(wǎng)頁制作、WEB標準化版塊參加討論，我還想發(fā)表評論。
|
第 1 頁 
第 2 頁 JavaScript Table行定位效果 [2]
