document.documentElement与document.body clientHeight,scrollHeight,clientWidth,scrollWidth区别

标题名不太好,呵呵!今天写了个简单的弹出层插件,学到了一些东东

1.document.documentElement与document.body  

页面具有 DTD,或者说指定了 DOCTYPE 时,使用 document.documentElement。

页面不具有 DTD,或者说没有指定了 DOCTYPE,时,使用 document.body。

在 IE 和 Firefox 中均是如此。

为了兼容,不管有没有 DTD,可以使用如下代码:

var scrollTop = window.pageYOffset //用于FF || document.documentElement.scrollTop || document.body.scrollTop || 0;

var    s  =  "网页可见区域宽:"+  document.body.clientWidth; 
s  +=  "\r\n网页可见区域高:"+  document.body.clientHeight; 
s  +=  "\r\n网页可见区域高:"+  document.body.offsetWeight  +"  (包括边线的宽)"; 
s  +=  "\r\n网页可见区域高:"+  document.body.offsetHeight  +"  (包括边线的宽)"; 
s  +=  "\r\n网页正文全文宽:"+  document.body.scrollWidth; 
s  +=  "\r\n网页正文全文高:"+  document.body.scrollHeight; 
s  +=  "\r\n网页被卷去的高:"+  document.body.scrollTop; 
s  +=  "\r\n网页被卷去的左:"+  document.body.scrollLeft; 
s  +=  "\r\n网页正文部分上:"+  window.screenTop; 
s  +=  "\r\n网页正文部分左:"+  window.screenLeft; 
s  +=  "\r\n屏幕分辨率的高:"+  window.screen.height; 
s  +=  "\r\n屏幕分辨率的宽:"+  window.screen.width; 
s  +=  "\r\n屏幕可用工作区高度:"+  window.screen.availHeight; 
s  +=  "\r\n屏幕可用工作区宽度:"+  window.screen.availWidth; 

原文地址:https://www.cnblogs.com/ymj0906/p/2567346.html