zoukankan      html  css  js  c++  java
  • js 获取 客户区 大小

    js 获取 客户区 大小

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

    [javascript] view plaincopy
    1. <script type="text/javascript">  
    2.     function getClientPoint()  
    3.     {  
    4.         if(document.compatMode=="BackCompat")  
    5.         {  
    6.             return {  
    7.                         document.body.clientWidth,  
    8.                         height:document.body.clientHeight  
    9.                     };  
    10.         }else  
    11.         {  
    12.             return {  
    13.                         document.documentElement.clientWidth,  
    14.                         height:document.documentElement.clientHeight  
    15.                     };  
    16.         }  
    17.     }  
    18.     var point=getClientPoint();  
    19.     alert(point.width+"__"+point.height)  
    20. </script>  


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

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

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

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

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

  • 相关阅读:
    盒子跟随鼠标移动而移动(兼容IE8)
    JavaScript捕获鼠标坐标
    JavaScript判断滚动条是否滚动到底部
    JavaScript自定义getStyle方法获取元素样式
    JavaScript实现简单的图片切换功能
    SpeedReader
    JavaScript定时器
    远程登陆ubantu服务器 .bashrc文件每次打开终端都需要source的问题
    阿里云服务器Ubantu16.04升级python3.6
    阿里云服务器ubantu创建新用户登录显示问题
  • 原文地址:https://www.cnblogs.com/zhangxiaolei521/p/5015920.html
Copyright © 2011-2022 走看看