Math方法详解

  1. Math.sqrt(x)    计算X开平方
  2. Math.sqrt(x,y)   计算xy
  3. Math.round(x)   计算x 四舍五入的值

getBoundingClientRect()

这个方法返回一个矩形对象,包含四个属性:left、top、right和bottom。分别表示元素各边与页面上边和左边的距离。

var box=document.getElementById('box');         // 获取元素

alert(box.getBoundingClientRect().top);         // 元素上边距离页面上边的距离

alert(box.getBoundingClientRect().right);       // 元素右边距离页面左边的距离

alert(box.getBoundingClientRect().bottom);      // 元素下边距离页面上边的距离

alert(box.getBoundingClientRect().left);        // 元素左边距离页面左边的距离

注意:IE、Firefox3+、Opera9.5、Chrome、Safari支持,在IE中,默认坐标从(2,2)开始计算,导致最终距离比其他浏览器多出两个像素,我们需要做个兼容。

document.documentElement.clientTop;  // 非IE为0,IE为2

document.documentElement.clientLeft; // 非IE为0,IE为2

functiongGetRect (element) {

var rect = element.getBoundingClientRect();

var top = document.documentElement.clientTop;

var left= document.documentElement.clientLeft;

return{

top    :   rect.top - top,

bottom :   rect.bottom - top,

left   :   rect.left - left,

right  :   rect.right - left

}

}

分别加上外边据、内边距、边框和滚动条,用于测试所有浏览器是否一致。

js中的function的更多相关文章

  1. js中使用function定义类、实例化,函数的调用方法

    function Test002(name, age){ name, age, this.printInfo = function(){ //定义的公有方法 console.log(name, age ...

  2. JS中的Function对象

    Function是函数的原型,所有的函数都来源于Function,获得函数的方法有两种类型,分为动态函数和函数继承. 动态函数 创建一个Function语法: var func = new Funct ...

  3. js中 a : function(){}这是什么格式? 代表什么含义?怎样学习这样的格式?

    js中的json. 一种轻量级数据格式.json中的值是map形式的就是key->value. 具体看下边的示例; var person = { // 用 大括号括声明一个json. " ...

  4. 【微信小程序】在js中导入第三方js或自己写的js,使用外部js中的function的两种方法 import和require的区别使用方法 【外加:使用第三方js导出的默认function的调用方法】

    如下 定义了一个外部js文件,其中有一个function import lunaCommon from '../lunaCommon.js'; var ctx = wx.getStorageSync( ...

  5. 详细js中(function(window,document,undefined))的作用

    在jquery插件中我们经常看到以下这段代码 对于很多初学者来说很难明白这表示什么,下边我将为大家介绍其相应的作用. 1.代码最前面的分号,可以防止多个文件压缩合并以为其他文件最后一行语句没加分号,而 ...

  6. js中,(function(){})()的用法解析

    (function($){...})(jQuery)  含义 经常用,今天总结一下,下文摘自某网友的总结: (function($){...})(jQuery)实际上是匿名函数,不懂得朋友可以继续往下 ...

  7. js中的Function和Object

    说到构造器(condtructor).原型链(prototype),说道Function与Object,总要祭出下面这张图 1.Function是最顶层的构造器,Object是最顶层的对象 2.先有的 ...

  8. js中的(function(){})()立即执行

    ( function(){-} )() 和 ( function (){-} () ) 是两种javascript立即执行函数的常见写法,要理解立即执行函数,需要先理解一些函数的基本概念. 函数声明. ...

  9. prototype.js中Function.prototype.bind方法浅解

    prototype.js中的Function.prototype.bind方法: Function.prototype.bind = function() { var __method = this; ...

随机推荐

  1. c# 基础复习1

    1. 类和对象 1.1 类和对象的概念 类:对象的类型,它不同于 int 等基本数据类型,因为类具有行为:也可以说是具有相 同特征和行为的一组对象的集合. 对象:对象是一个个你能看得见,摸得着的实体, ...

  2. 使用“bulk insert ”进行批量插入数据

    本文转自csdn中文章,再次感谢他给我们分享. Bulk Insert命令详细 BULK INSERT以用户指定的格式复制一个数据文件至数据库表或视图中.语法: BULK INSERT [ [ 'da ...

  3. App轮播图

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

  4. 使用GCD的dispatch_once创建单例

    使用GCD的dispatch_once创建单例 介绍了创建单例的方式,不过后来发现其实在ios 4.0后有更加简单的方式. 就是使用GCD的功能 代码如下: + (instantClass *)sha ...

  5. MySQL 学习笔记 (范式)

    范式基本就是不要有重复的数据,表和表之间都是用主键和外键来联系 表的关系通常分3中 1 对 1 1 对 多 多 对 多 多 对 多 是用另一个表来实现的,这个表记入了a 表和 b表之间多对多的联系主键

  6. VS2015 C#6.0 中的那些新特性(转载)

    自动属性初始化 (Initializers for auto-properties) 以前我们是这么写的 为一个默认值加一个后台字段是不是很不爽,现在我们可以这样写 只读属性的初始化(Getter-o ...

  7. Visio 下载,及密钥

    Visio2010简体中文高级版(永久激活密钥:GR24B-GC2XY-KRXRG-2TRJJ-4X7DC) ed2k://|file|cn_visio_2010_x64_516562.exe|515 ...

  8. perl post 请求相关参数

    $ua->post( $url, \%form ) $ua->post( $url, \@form ) $ua->post( $url, \%form, $field_name =& ...

  9. POJ3580---SuperMemo (Splay)

    各种操作,区间更新,求最值.翻转.插入.删除.当然是Splay这种神器了. 主要是 revolve这个操作,其实也就是3个区间翻转放到一块, 比如 REVOLVE x y T,T %= (y-x+1) ...

  10. Permutations 解答

    Question Given a collection of numbers, return all possible permutations. For example,[1,2,3] have t ...