网页可见区域宽: 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.height;

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

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

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

scrollHeight: 获取对象的滚动高度。

scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离

scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离

scrollWidth:获取对象的滚动宽度

offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度

offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置

offsetTop:获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端位置

event.clientX 相对文档的水平座标

event.clientY 相对文档的垂直座标

event.offsetX 相对容器的水平坐标

event.offsetY 相对容器的垂直坐标

document.documentElement.scrollTop 垂直方向滚动的值

event.clientX+document.documentElement.scrollTop 相对文档的水平座标+垂直方向滚动的量

【以上主要指IE之中,FireFox差异如下:】

IE6.0、FF1.06+:

clientWidth = width + padding

clientHeight = height + padding

offsetWidth = width + padding + border

offsetHeight = height + padding + border

IE5.0/5.5:

clientWidth = width - border

clientHeight = height - border

offsetWidth = width

offsetHeight = height

HTML控件offsetTop、scrollTop等属性

假设 obj 为某个 HTML 控件。
obj.offsetTop 指 obj 距离上方或上层控件的位置,整型,单位像素。
obj.offsetLeft 指 obj 距离左方或上层控件的位置,整型,单位像素。
obj.offsetWidth 指 obj 控件自身的宽度,整型,单位像素。
obj.offsetHeight 指 obj 控件自身的高度,整型,单位像素。

JS中offsetwidth等图文解释的更多相关文章

  1. JQuery中width和JS中JS中关于clientWidth offsetWidth scrollWidth 等的含义

    JQuery中: width()方法用于获得元素宽度: innerWidth()方法用于获得包括内边界(padding)的元素宽度: outerWidth()方法用于获得包括内边界(padding)和 ...

  2. js中的offsetWidth岁的BUG

    ---恢复内容开始--- 在js使用offsetWidth来操作控件的运动是会遇到: var oDiv = document.getElementById('div1') oDiv.style.wid ...

  3. [js]js中4种无节操的预解释情况

    js中4种无节操的预解释情况 - 1. if语句即使条件不成立,条件里的表达式也会进行预解释. - 2. 匿名函数的预解释: 只对等号左边与解释 - 3. 自执行函数的预解释: 不进行预就解释, 执行 ...

  4. [js]js的惰性声明, js中声明过的变量(预解释),后在不会重新声明了

    js的惰性声明, js中声明过的变量(预解释),后在不会重新声明了 fn(); // 声明+定义 js中声明过一次的变量,之后在不会重新声明了 function fn() { console.log( ...

  5. 如何才能通俗易懂地解释JS中的的"闭包"?

    看了知乎上的话题 如何才能通俗易懂的解释javascript里面的‘闭包’?,受到一些启发,因此结合实例将回答中几个精要的答案做一个简单的分析以便加深理解. 1. "闭包就是跨作用域访问变量 ...

  6. js中的预解释

    在js中,带var 和function关键字的需要预解释: 那什么是预解释?就是在js代码执行之前,先申明好带有var 关键字和带有function关键字的变量,在内存里先安排好.但是带有var关键字 ...

  7. js中clientWidth, scrollWidth, innerWidth, outerWidth,offsetWidth的区别

    js中clientWidth, scrollWidth, innerWidth, outerWidth,offsetWidth的属性汇总,测试浏览器:ie7~ie11.chrome 和 firefox ...

  8. 图文结合深入理解 JS 中的 this 值

    图文结合深入理解 JS 中的 this 值 在 JS 中最常见的莫过于函数了,在函数(方法)中 this 的出现频率特别高,那么 this 到底是什么呢,今天就和大家一起学习总结一下 JS 中的 th ...

  9. JS中的offsetWidth、offsetHeight、clientWidth、clientHeight等等的详细介绍

    javascript中offsetWidth.clientWidth.width.scrollWidth.clientX.screenX.offsetX.pageX 原文:https://www.cn ...

随机推荐

  1. 通过form表单获取值

    <!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title> ...

  2. Java IO教程

    1  Java IO 教程 2 Java IO 概述 3 Java IO: 文件 4 Java IO: 管道 5 Java IO: 网络 6 Java IO: 字节和字符数组 7 Java IO: S ...

  3. b/s 猫大叔

       好复杂,要把客户端文件传到服务端,再从服务端传到FTP......肿么设计的这是....       至少你都要把客户端的文件读到服务端的内存中,因为B/S控制器在S端,不在B端 非要用B/S实 ...

  4. CentOS_7.2安装PHP_5.6

    一.安装依赖包和开发工具: yum install vim vim-enhanced wget zip unzip telnet ntsysv compat* apr* nasm* gcc gcc* ...

  5. NoSQL生态系统——类似Bigtable列存储,或者Dynamo的key存储(kv存储如BDB,结构化存储如redis,文档存储如mongoDB)

    摘自:http://www.ituring.com.cn/article/4002# NoSQL系统的数据操作接口应该是非SQL类型的.但在NoSQL社区,NoSQL被赋予了更具有包容性的含义,其意为 ...

  6. Apache、NGINX支持中文URL

    Apache(32位):安装环境:CentOS 5.6 + Apache 2.2.15安装结果:安装后支持“中文图片.文件名”链接直接打开以下为安装过程:1.下载安装包 wget ftp://ftp. ...

  7. [原创]C#引用C++编译的dll

    一.DllImportAttribute 1.属性介绍 using System; using System.Reflection; using System.Security; namespace ...

  8. 如何查询postgresql+openstreetmap

    先行输入:psql gis \d 显示当前数据表 List of relations Schema | Name | Type | Owner --------+------------------- ...

  9. Fragment的startActivityForResult和Activity的startActivityForResult的区别

    2016-08-30 18:22:33 前提:我们的APP要兼容Api level 11以前的,所以必须用FragmentActivity 1.对于Fragment的,我们很多时候都会在Activit ...

  10. jquery qrcode参数

    { // render method: 'canvas', 'image' or 'div' render: 'canvas', // version range somewhere in 1 .. ...