1.有滚动条的控件的距离:

scrollTop和scrollLeft:分别指有滚动条的容器控件的滚动条的top和left;页面滚动条的通用取法:document.body.scrollTop(FF\CHROM) || document.documentElement.scrollTop(IE);

当然了,你要非想给没滚动条的控件加scrollTop,也不报错,就是0;

2.DOM控件的距离:

offsetTop和offsetLeft:指标签对应父级的绝对Top和Left;

offsetWidth和offsetHeight:算出控件的绝对宽度和绝对高度,就是控件宽加边框宽。火狐是一个很奇葩的浏览器,加了border的div等控件,总是把border给缩水那么0.几几,所以不要随便用边框啊。

3.事件的距离

clientX和clientY:指在能发生事件的范围内所发生事件的焦点相对于该范围的横纵距离。

clientWidth和clientHeight:指诱导该事件发生的主体的宽度和高度。

4.BOM里的宽高:window.screen.xxx

availHeight/availWidth:浏览器只显示网页内容的宽高(不随浏览器的窗口大小改变而改变)

height/width:浏览器的总体宽高(不随浏览器的窗口大小改变而改变)

-------------------------------------------------------------------------

一些差异

IE chrome opera们

1.window.screen.heigth:是你浏览器最大化的高度。

2.body html设为100%后的高度:分别是浏览器中间网页的高度 和页面高+滚动条高。

3.document没有高度,为null

火狐这个傻逼

1.window.screen.height:是从浏览器的选项卡那儿开始到网页区的高度

2.body html设为100%后的高度

Javascript里的那些距离们的更多相关文章

  1. javascript里for循环的一些事情

    今天在给一个学妹调她的代码BUG时,她的问题就是在一个for循环里不清楚流程的具体流向,所以导致了页面怎么调都是有问题,嗯确实你如果不清楚语句流向很轻易就会出问题,所以说for循环不会用或者说用的不恰 ...

  2. Javascript里,想把一个整数转换成字符串,字符串长度为2

    Javascript里,想把一个整数转换成字符串,字符串长度为2.  想把一个整数转换成字符串,字符串长度为2,怎么弄?比如 1 => "01"11 => " ...

  3. JavaScript里的依赖注入

    JavaScript里的依赖注入 我喜欢引用这句话,“程序是对复杂性的管理”.计算机世界是一个巨大的抽象建筑群.我们简单的包装一些东西然后发布新工具,周而复始.现在思考下,你所使用的语言包括的一些内建 ...

  4. 如何才能通俗易懂的解释javascript里面的"闭包"?

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

  5. javascript里的循环语句

    前序:我一直对于for跟for..in存在一种误解,我觉得for都能把事情都做了,为啥还要for...in...这玩意了,有啥用,所以今天就说说JavaScript里的循环语句. 循环 要计算1+2+ ...

  6. Safari 里的javascript 里不能用submit作为函数名

    Safari 里的javascript 里不能用submit作为函数名, 这样写的时候,怎么也运行不了JeasyUI的onSubmit的function, 改个名就可以了.而在chrome下面就没问题 ...

  7. JavaScript 里,$ 代表什么?/JQuery是什么语言?/html中用link标签引入css时的中 rel="stylesheet"属性?/EL表达式是什么?

    JavaScript 里,$ 代表什么? 比如说我写一个mouseover事件: $(document).ready(function(){ $("p").mouseover(fu ...

  8. JavaScript里的循环方法总结

    JavaScript诞生已经有20多年了,我们一直使用的用来循环一个数组的方法是这样的: for (var index = 0; index < myArray.length; index++) ...

  9. JavaScript里的循环方法之forEach,for-in,for-of

    JavaScript一种直译式脚本语言,是一种动态类型.弱类型.基于原型的语言,内置支持类型.它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML(标 ...

随机推荐

  1. Python学习教程(learning Python)--1.1Python程序设计流程

    Python程序设计与其他高级语言程序设计流程基本一致     step1 程序设计     step2 编写Python代码     setp3 Python语句语法纠错     step4 测试程 ...

  2. Nginx初始化过程总结

    对于Nginx这样一个模块化的服务器,看代码是最好的理解方式了.再此通过读main() 函数来简述一下Nginx的初始化过程: 这就是整个main函数的执行过程:

  3. Redis 四:存储类型之有序集合

    有序集合似乎更大的操作是由于加了一个叫做“分子”的东西 事实上就好像普通的数据,只是为这个数据加了一个纯数字的标识, 通过操作这些标识来得到我们想要的数据! 分子可以是整形,也可以是双精度浮点型: = ...

  4. [转]Squid中的日志出现TCP_CLIENT_REFRESH_MISS的问题排除

    转自:http://www.php-oa.com/2008/07/15/tcp_client_refresh_miss.html 今天检查Squid发现大量的日志出现TCP_CLIENT_REFRES ...

  5. flask中文问题

    在使用flask时在模板中使用了中文,运行的时候遇到下面的问题: UnicodeDecodeError UnicodeDecodeError: 'utf8' codec can't decode by ...

  6. 解决sharepoint 2010 用户配置文件同步服务 正在启动

    用户配置文件同步服务一直显示“正在启动”,而且无法停止,如下办法可以停止这个服务: 在sharepoint power shell 中执行下面的命令: Get-spserviceinstance 获取 ...

  7. 加速传感器(CoreMotion) swift

    // // ViewController.swift // UILabelTest // // Created by mac on 15/6/23. // Copyright (c) 2015年 fa ...

  8. ABAP文本编辑框操作

    * 1.创建文本框 DATA: g_container TYPE REF TO cl_gui_custom_container, g_editor TYPE REF TO cl_gui_textedi ...

  9. C++中不可重载的5个运算符

    大多数运算符都是可以重载的,但是有5个运算符C++语言规定是不可以重载的. 1. .(点运算符),通常用于去对象的成员,但是->(箭头运算符),是可以重载的 2.::(域运算符),即类名+域运算 ...

  10. js节点解析

    在JS中,每一个节点都有一个nodeType 属性,用于表明节点的类型.节点类型由在Node 类型中定义的下列12个数值常量来表示,任何节点类型必居其一: Node.ELEMENT_NODE(1); ...