getBoundingClientRect

最新推荐文章于 2025-10-29 12:05:52 发布

最新推荐文章于 2025-10-29 12:05:52 发布 · 191 阅读

文章标签：

本文探讨了 getBoundingClientRect API 在不同浏览器版本中的表现差异。通过一个具体示例展示了 IE7-8、IE9、Chrome 和 Firefox 返回的不同结果。

getBoundingClientRect

---------- 随着时代变更，这个api也从IE私有变成了标准。但是不同的版本返回的值不一样！

先看实例：

<div id="test">我是测试代码</div>

#test{
	position:absolute;
	left:300px;
	top:100px;
	width:500px;
	height:500px;
	background:red;
	color:white;
	text-align:center;
}

document.getElementById("test").getBoundingClientRect()

先看一下IE7-8返回的值：

再看一下IE9返回的值：

再看一下chrome的返回的值：

再看一下ff的返回的值：