DOM元素尺寸与位置

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了DOM元素尺寸与位置相关的知识,希望对你有一定的参考价值。

// clientWidth, clientHeight
   1. 增加边框、外边距,DOM实际大小不受影响
   2. 增加滚动条,会减少DOM实际大小,原因不把滚动条的大小算在内
   3. 增加内间距,会影响DOM实际大小
   4. 在没有内边距和滚动条的情况下,没有设置CSS大小,那么IE浏览器会理解为0

 

// scrollWidth, scrollHeight
   1. 增加边框,浏览器之间有兼容问题
   2. 增加外间距,DOM实际大小不受影响
   3. 增加滚动条,会减少DOM实际大小,原因不把滚动条的大小算在内
   4. 增加内间距,会影响DOM实际大小
   5. 有文本溢出时,加上滚动条方可解决兼容问题
// offsetWidth, offsetHeight
   1. 增加边框、内间距,会影响DOM实际大小
   2. 增加外间距、滚动条,DOM实际大小不受影响

 

以上是关于DOM元素尺寸与位置的主要内容,如果未能解决你的问题,请参考以下文章

JavaScript获取DOM元素位置和尺寸大小

JavaScript获取DOM元素位置和尺寸大小

JavaScript获取DOM元素位置和尺寸大小

十八DOM元素尺寸和位置

窗口属性 和DOM 元素尺寸位置 及习题加强

JavaScript获取DOM元素位置和尺寸