insertCell在IE，火狐，谷歌下

最新推荐文章于 2021-02-26 11:35:54 发布

兮风

最新推荐文章于 2021-02-26 11:35:54 发布

阅读量2.7k

点赞数 1

分类专栏：脚本

本文链接：https://blog.csdn.net/pk490525/article/details/16881363

版权

脚本专栏收录该内容

7 篇文章 0 订阅

订阅专栏

今天在调整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 οnlοad="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>

兮风

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
insertCell在IE，火狐，谷歌下

今天在调整js的兼容性发现了insertCell的兼容性问题，现在具体说下：insertCell就是js动态向表格行插入列的操作，在IE、火狐下，先插先到，也就是从第0列开始依次后移。在谷歌下，是后来居上依次后推，比如你首次插入了insertCell，该列在第1列，接着又插入了一列，刚刚的那列就变成了第2列，依次后推，为了达到三个浏览器的兼容性，我们可以采用appendChild的方式进行操作
复制链接

扫一扫

专栏目录