• js获取浏览器和元素对象的尺寸


    1.屏幕尺寸
    1 window.screen.height               //屏幕分辨率的高
    2 window.screen.width                //屏幕分辨率的宽
    3 window.screen.availHeight          //屏幕可用工作区的高
    4 window.screen.availWidth           //屏幕可用工作区的宽
    2、window对象尺寸
    1  //获取窗口中文档显示区域的宽度及高度(兼容IE与DOM浏览器):
    2  window.innerWidth ? window.innerWidth : document.body.clientWidth;
    3  window.innerHeight ? window.innerHeight : document.body.clientHeight;
    4  
    5 //innerHeight:窗口中文档显示区域的高度,不包括菜单栏、工具栏等部分,可读可写。IE不支持,IE中body元素的clientHeight与该属性相同。
    6 //innerWidth:窗口中文档显示区域的宽度,该属性可读可写。IE不支持,IE中body元素的clientWidth与该属性相同。clientHeight与clientWidth属性是只读的。
    3、元素对象尺寸
    • offsetWidth (width+padding+border)当前对象的宽度。

      style.width也是当前对象的宽度(width+padding+border)。区别:

      1)style.width返回值除了数字外还带有单位px;
      2)如对象的宽度设定值为百分比宽度,则无论页面变大还是变小,style.width都返回此百分比,而offsetWidth则返回在不同页面中对象的宽度值而不是百分比值;
      3)如果没有给HTML元素指定过width样式,则style.width 返回的是空字符串

    • offsetHeight :(Height+padding+border)当前对象的高度。

      style.height也是当前对象的高度(height+padding+border)。区别:

        1)style.height返回值除了数字外还带有单位px;
           )如对象的高度设定值为百分比高度,则无论页面变高还是变矮,style.height都返回此百分比,而offsetHeight则返回在不同页面中对象的高度值而不是百分比值;
          3)如果没有给HTML元素指定过height样式,则style.height返回的是空字符串

    1 scrollWidth     //获取对象的滚动宽度 
    2 scrollHeight    //获取对象的滚动高度
    3 clientWidth     //获取对象可见内容的宽度,不包括滚动条,不包括边框
    4 clientHeight    //获取对象可见内容的高度,不包括滚动条,不包括边框
    4、元素对象偏移属性
    1 offsetLeft      //当前对象到偏移参考父元素左边的距离,不能对其进行赋值,设置对象到父元素左边的距离用style.left
    2 offsetTop       //当前对象到偏移参考父元素顶部的距离,不能对其进行赋值,设置对象到父元素顶部的距离用style.top
    3 offsetParent    //当前对象的偏移参考父元素
  • 相关阅读:
    一些误解和错误的看法
    负载均衡了解
    《网络编程》守护进程
    Cocos2d-x 3.2编译Android程序错误的解决方案
    ArcMap合并之路 -- 该段路合并成一个完整的路
    让你提前知道软件开发(24):C语言和主要特征的历史
    Java中的TCP/UDP网络通信编程
    Android中Socket大文件断点上传
    android 自定义progressDialog实现
    开发Mhealth(即:Mobile Health 移动医疗)应用必知的10个掘金点
  • 原文地址:https://www.cnblogs.com/wuln/p/7195057.html
走看看 - 开发者的网上家园