当前位置:去回答>百科知识>js中的clientHeight和offsetHeight有什么区别么?

js中的clientHeight和offsetHeight有什么区别么?

2024-09-05 11:46:09 编辑:join 浏览量:567

js中的clientHeight和offsetHeight有什么区别么?

js中的clientHeight和offsetHeight的区别如下:

1、clientHeight

网页(内容)可见区域高:document.body.clientHeight 即页面浏览器中可以看到内容的这个区域的高度,一般是最后一个工具条以下到状态栏以上的这个区域,与页面内容无关。

注意:IE、Opera 认为 scrollHeight 是网页内容实际高度,可以小于 clientHeight。

2、offsetHeight

网页可见区域高:document.body.offsetHeight (包括边线的宽)

二者联系:

NS、 FF 认为 offsetHeight 和 scrollHeight 都是网页内容高度,只不过当网页内容高度小于等于 clientHeight 时,scrollHeight 的值是 clientHeight,而 offsetHeight 可以小于 clientHeight。

js中的clientHeight和offsetHeight的区别如下:

1、clientHeight

网页(内容)可见区域高:document.body.clientHeight 即页面浏览器中可以看到内容的这个区域的高度,一般是最后一个工具条以下到状态栏以上的这个区域,与页面内容无关。

注意:IE、Opera 认为 scrollHeight 是网页内容实际高度,可以小于 clientHeight。

2、offsetHeight

网页可见区域高:document.body.offsetHeight (包括边线的宽)

二者联系:

NS、 FF 认为 offsetHeight 和 scrollHeight 都是网页内容高度,只不过当网页内容高度小于等于 clientHeight 时,scrollHeight 的值是 clientHeight,而 offsetHeight 可以小于 clientHeight。

百度的。。。。。。。。。。。

clientHeight

大部分浏览器对 clientHeight 都没有什么异议,都认为是内容可视区域的高度,也就是说页面浏览器中可以看到内容的这个区域的高度,即然是指可看到内容的区域,滚动条不算在内。但要注意padding是算在内。其计算方式为clientHeight = topPadding + bottomPadding+ height - scrollbar.height。

offsetHeight

在IE6,IE7,IE8以及最新的的FF, Chrome中,在元素上都是offsetHeight = clientHeight + 滚动条 + 边框。

scrollHeight

scrollHeight是元素的padding加元素内容的高度。这个高度与滚动条无关,是内容的实际高度。

计算方式 :scrollHeight = topPadding + bottomPadding + 内容margix box的高度。

在浏览器中的区别在于:

IE6、IE7 认为scrollHeight 是网页内容实际高度,可以小于clientHeight。

FF、Chrome 认为scrollHeight 是网页内容高度,不过最小值是clientHeight。

注: 以上都是对于一般元素而方言的,body和documentElement的clientHeight, offsetHeight和scrollHeight在各个浏览器中的计算方式又不同。在所有的浏览器中,如果你想获取整个视窗的高度,你得用documentElement.clientHeight,因为body.clientHeight是由它的内容决定的。 关于body和documentElement的这些属性,则完全是另外一回事:

clientHeight是屏幕可见的高度

offsetHeight是网页内容的高度

lz可以输出的看

document.documentElement.offsetHeight

document.documentElement.clientHeight

标签:js,clientHeight,offsetHeight

版权声明:文章由 去回答 整理收集,来源于互联网或者用户投稿,如有侵权,请联系我们,我们会立即处理。如转载请保留本文链接:https://www.quhuida.com/article/245604.html
热门文章