# 相关尺寸

**获取元素相对于文档的偏移量**

> var pos = $('#small').offset(); 
>
> // console.log(pos.left);// console.log(pos.top); **获取当前元素相对于父级元素的偏移量** > var l = $('#small').position().left;
>
> var t = $('#small').position().top;
>
> // console.log(l,t); **获取文档滚动距离** > var st = $(document).scrollTop();
>
> var sl = $(document).scrollLeft(); **获取元素的宽度和高度** > var w = $('#big').width();
>
> var h = $('#big').height(); **设置元素的宽度和高度** > $('#big').width(400);
>
> $('#big').height(400);
>
> // console.log(w,h); **获取可视区域的宽度和高度** > var cw = $(window).width();
>
> var ch = $(window).height(); **获取文档的宽度和高度** > var cw = $(document).width();
>
> var ch = $(document).height();
>
> console.log(cw,ch); # 关于事件 ## 事件绑定 1.**基本绑定** > $(element).click(function(){})
>
> $(element).dblclick(function(){})
>
> 。。。
>
> 加载完毕事件
>
> $(document).ready(function(){})
>
> $(function(){}) 2.**方法绑定** > $(element).bind('click', function(){})//绑定事件
>
> $(element).unbind();//解除事件绑定

12-jQuery获取相关尺寸的更多相关文章

  1. jQuery的相关尺寸获取 - 学习笔记

    获取元素相对于文档的偏移量 获取当前元素相对于父级元素的偏移量 获取文档滚动距离 获取元素的宽度和高度 设置元素的宽度和高度 获取可视区域的宽度和高度 获取文档的宽度和高度 获取元素相对于文档的偏移量 ...

  2. [Web 前端] 027 jQuery 相关尺寸与事件绑定

    1. 相关尺寸 1.1 获取元素相对于文档的偏移量 var pos = $('#small').offset(); console.log(pos.left, pos.top); 1.2 获取当前元素 ...

  3. aspx中的表单验证 jquery.validate.js 的使用 以及 jquery.validate相关扩展验证(Jquery表单提交验证插件)

    这一期我们先讲在aspx中使用 jquery.validate插件进行表单的验证, 关于MVC中使用 validate我们在下一期中再讲     上面是效果,下面来说使用步骤 jQuery.Valid ...

  4. jQuery获取Radio选择的Value值||两个select之间option的互相添加操作(jquery实现)

    jQuery获取Radio选择的Value值: 1. $("input[name='radio_name'][checked]").val();  //选择被选中Radio的Val ...

  5. jquery 获取css position的值

      jquery 获取css position的值 CreateTime--2018年5月28日14:03:12 Author:Marydon 1.情景展示 <div id="aa&q ...

  6. Jquery获取select option动态添加自定义属性值失效

    Jquery获取select option动态添加自定义属性值失效 2014/12/31 11:49:19 中国学网转载 编辑:李强 http://www.xue163.com/588880/3909 ...

  7. js/jquery获取文本框的值与改变文本框的值

    我们就用它来学习获取文本框的值及改变文本框的值. 代码如下 复制代码 <script>function get1(){ document.getElementById("txtb ...

  8. jQuery获取多种input值的方法

    1 if($("input[name=item][value='val']").attr('checked')==true) //判断是否已经打勾 name即控件name属性,va ...

  9. jquery 获取设置值、添加元素详解

    jQuery 获取内容和属性 jQuery DOM 操作 jQuery 中非常重要的部分,就是操作 DOM 的能力. jQuery 提供一系列与 DOM 相关的方法,这使访问和操作元素和属性变得很容易 ...

随机推荐

  1. linux运维、架构之路-Kickstart无人值守

    一.PXE介绍          PXE全名Pre-boot Execution Environment,预启动执行环境:通过网络接口启动计算机,不依赖本地存储设备或本地已安装的操作系统:Client ...

  2. luogu P1068 分数线划定 x

    P1068 分数线划定 题目描述 世博会志愿者的选拔工作正在 A 市如火如荼的进行.为了选拔最合适的人才,A 市对 所有报名的选手进行了笔试,笔试分数达到面试分数线的选手方可进入面试.面试分数线根 据 ...

  3. 【bzoj1093】 [ZJOI2007]最大半连通子图

    *题目描述: 一个有向图G=(V,E)称为半连通的(Semi-Connected),如果满足:?u,v∈V,满足u→v或v→u,即对于图中任意 两点u,v,存在一条u到v的有向路径或者从v到u的有向路 ...

  4. Internet History, Technology, and Security(week6)——Technology: Transport Control Protocol(TCP)

    前言: 这周开始学习分层网络模型的第三层,传输层. Transport/Reliability: Transport Layer TCP层的目的是补偿IP层中可能出现的错误,并充分利用可用资源.由于I ...

  5. layer 弹出层不能居中

    $("#btnAdd").button("loading"); parent.layer.open({ title: '添加菜单', type: 2, maxm ...

  6. 查询数据库对象的DDL信息

    表的DDL select dbms_metadata.get_ddl('HBBL','TABLE','AGREEMENT_MIRROR') from dual:

  7. centOS 7 安装nginx服务

    一.安装相关依赖 yum install gcc-c++ yum install -y pcre pcre-devel yum install -y zlib zlib-devel yum insta ...

  8. AtomicStampedReference 源码分析

    AtomicStampedReference AtomicStampedReference 能解决什么问题?什么时候使用 AtomicStampedReference? 1)AtomicStamped ...

  9. mkdir: 无法创建目录"kk": 只读文件系统

    创建文件提示 root@hap1:/test>mkdir kk mkdir: 无法创建目录"kk": 只读文件系统 root@hap1:/test>mount .... ...

  10. mysql5.7.23性能调优之innodb_buffer_pool_size

    前言 我的数据库版本是5.7.23,最近发现执行SQL越来越慢,一条SQL语句执行需要将近30s. 对于原因,查询资料, https://www.cnblogs.com/qwangxiao/p/892 ...