insertCell在IE，火狐，谷歌下
阿新 • • 發佈：2019-02-07
今天在調整js的相容性發現了insertCell的相容性問題，現在具體說下：
insertCell就是js動態向表格行插入列的操作，在IE、火狐下，先插先到，也就是從第0列開始依次後移。在谷歌下，是後來居上依次後推，比如你首次插入了insertCell，該列在第1列，接著又插入了一列，剛剛的那列就變成了第2列，依次後推，為了達到三個瀏覽器的相容性，我們可以採用appendChild的方式進行操作。
具體實現，參考下面例子：
<html>
<script type="text/javascript"><!--
function generatable(){
var tableObje = document.getElementById("info");
var bodyObj = tableObje.tBodies[0];
var rowObj = bodyObj.insertRow();
var cellObj = rowObj.insertCell();
cellObj.innerHTML = "張三";
cellObj = rowObj.insertCell();
cellObj.innerHTML = "請參閱我編寫的其他書目對應的指令碼特性為請參閱我編寫的其他書目";
cellObj = rowObj.insertCell();
cellObj.innerHTML = "當事人地址資訊請小房間也是檢視。";
}
function generatable1(){
var tableObje = document.getElementById("info");
var bodyObj = tableObje.tBodies[0];
var rowObj = document.createElement("tr");
var cellObj = document.createElement("td");
cellObj.innerHTML = "張三";
rowObj.appendChild(cellObj)
cellObj = document.createElement("td");
cellObj.innerHTML = "請參閱我編寫的其他書目對應的指令碼特性為請參閱我編寫的其他書目";
rowObj.appendChild(cellObj);
cellObj = document.createElement("td");
cellObj.innerHTML = "當事人地址資訊請小房間也是檢視。";
rowObj.appendChild(cellObj);
bodyObj.appendChild(rowObj);
}
// --></script>
<body onload="generatable()">
<table width=100 bgcolor=#f3f3f3 id=info border=1 style="table-layout:fixed;" mce_style="table-layout:fixed;">
<thead>
<tr>
<td style="width:80">姓名</td>
<td style="width:200">描述</td>
<td style="width:100">地址</td>
</tr>
</thead>
<tbody>
</tbody>
</table>
</body>
</html>