天天看点

关于clientWidth,clientHeight,offsetWidth,offsetHeight 等属性的意思

网页可见区域宽:document.body.clientWidth; 

网页可见区域高:document.body.clientHeight; 

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

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

网页正文全文宽:document.body.scrollWidth; 

网页正文全文高:document.body.scrollHeight; 

网页被卷去的高:document.body.scrollTop; 

网页被卷去的左:document.body.scrollLeft; 

网页正文部分上:window.screenTop; 

网页正文部分左:window.screenLeft; 

屏幕分辨率的宽:window.screen.width; 

屏幕分辨率的高:window.screen.height; 

屏幕可用工作区宽度:window.screen.availWidth; 

屏幕可用工作区高度:window.screen.availHeight;

有时会出现取不到值的情况,是因为我的HTML文件头部加了文档类型。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

或者

<!DOCTYPE html>

解决办法:

1.去掉头部文档类型。(不推荐此方法)

2.把document.body.scrollTop和document.body.scrollLeft这两个家伙改个名字,改成:document.documentElement.scrollTop 和document.documentElement.scrollLeft。当然document.body.clientWidth和document.body.clientHeight也要改名字了,改为:document.documentElement.clientWidth和document.documentElement.clientHeight