js 获取 客户区 大小

js 获取 客户区 大小

本文内容来自《javascript高级程序设计(第二版)》 内容, 只是方便大家以后可能会用到...

<script type="text/javascript">
    function getClientPoint()
    {
        if(document.compatMode=="BackCompat")
        {
            return {
                        width:document.body.clientWidth,
                        height:document.body.clientHeight
                    };
        }else
        {
            return {
                        width:document.documentElement.clientWidth,
                        height:document.documentElement.clientHeight
                    };
        }
    }
    var point=getClientPoint();
    alert(point.width+"__"+point.height)
</script>

document.compatMode 确定浏览器处于什么模式：

BackCompat：标准兼容模式关闭(混杂模式)。
CSS1Compat：标准兼容模式开启。

         也就是说在获取客户区大小的时候通过判断浏览器处于一个什么模式,如果是在混杂模式里面,通过document.body获取
否则,通过document.documentElement来获取

在Safari3.1之前的版本里面不支持这个属性, 所以同样走的是 else ,  这样就返回一个包含width和height属性的对象.

　　注意:这些属性都是只读的,而且每次访问的时候,都需要重新计算, 因此,应该尽量避免重复访问这些属性,如果需要重复使用这些属性，可以通过缓存的方式来保存（保存在局部变量里面）,以便提高性能,同时还有像 offsetTop,offsetLeft,offsetWidth,offsetHeight等偏移量属性,均是只读属性,都应该尽可能避免重复访问这 些属性!