位置坐标图形大小相关方法:

  .offset()

  .position()

  .scrollTop()  .scrollLeft()

  .width()  .height()

  .innerWidth()  innerHeight()

  .outerWidth()  .outerHeight()

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

  .offset()

获取该元素 距离文档的距离, 可以赋值

  .position()

获取该元素,距离最近父级的位置(也可以说 获取 css样式里面的值), 不可以赋值

  .scrollTop()  .scrollLeft()

获取滚动条 滚动的距离, 可以赋值   (选择谁, 就获取谁的滚动条。)

不止可以获取文档的滚动条, 也可以获取 元素的滚动条

  .width()  .height()

获取 content(内容) 区的 宽高

 

  .innerWidth()  .innerHeight()

获取 content(内容) 区  +  padding  的宽高  ,也就是  该元素宽高 加上 内边距的宽高 ;

  .outerWidth()  .outerHeight()

获取 content(内容) 区  +  padding  的宽高 再 +  border  的宽高 。也就是  该元素宽高 加上 内边距的宽高 再加上 边框的宽高 ;

可以填参数 .outerWidth(true)   一旦填了 true 那么,获取的宽高 会再加上 margin, 也就是说  内容区, 内边距, 边框,外边距, 全加上了。

jQuery 第七章 实例方法 位置图形的更多相关文章

  1. jQuery第七章插件的编写和使用

    1.本章目标 编写jquery插件 2.插件 也称为扩展,是一种按照一定的规范的应用程序接口编写出来的程序 插件的目标是给已有的一系列函数做一个封装,以便在其他的地方复用,方便维护和开发效率 3.jq ...

  2. jQuery 第五章 实例方法 详解动画之animate()方法

    .animate()   .stop()   .finish() ------------------------------------------------------------------- ...

  3. jQuery 第五章 实例方法 事件

    .on() .one() .off() .trigger() .click / keydown / mouseenter ...    .hover() ----------------------- ...

  4. jQuery 第五章 实例方法 详解内置队列queue() dequeue() 方法

    .queue() .dequeue() .clearQueue() ------------------------------------------------------------------ ...

  5. jQuery 第六章 实例方法 动画

    .show() .hide() .toggle() .fadeIn() .fadeout() .fadeToggle() .fadeTo() .slideDown() .slideUp() .slid ...

  6. jQuery 第四章 实例方法 DOM操作之data方法

    jquery 里面 的 data 方法比较重要, 所以成一个模块写: 首先, 得知道 data()  干嘛用的, 看淘宝上 有自定义的属性, 为data -  什么什么,   这是为了dom 跟数据有 ...

  7. jQuery 第四章 实例方法 DOM操作_基于jQuery对象增删改查相关方法

    .next() .prev() .nextAll() .prevAll() .prevUntil() .nextUntli() .siblings() .children() .parent() .p ...

  8. 第七章、PyQt图形界面应用程序的事件捕获方法

    老猿Python博文目录 专栏:使用PyQt开发图形界面Python应用 老猿Python博客地址 一. 概述 PyQt的图形界面应用中,事件处理类似于Windows系统的消息处理.一个带图形界面的应 ...

  9. jQuery系列 第七章 jQuery框架DOM操作

    第七章 jQuery框架的选择器 jQuery框架继承和优化了JavaScript访问DOM对象的特性,我们使用jQuery框架提供的api可以更加方便的操作DOM对象. 7.1 创建DOM节点 使用 ...

随机推荐

  1. apktool重新打包添加签名

    一.生成apk apktool b 反编译后项目目录 -o 新apk名称.apk 二.生成签名 keytool -genkeypair -alias 新apk名称.apk -keyalg RSA -v ...

  2. 使用js模拟点击,点击a链接 $("#abc ").click(); 无效的解决方案

    摘要: 问题分析 点击A标签本身,并不会触发跳转到指定链接的事件,就是说,我们平时都是点击的A标签中的文字了. 所以要想用JS模拟点击A标签事件,就得先往A标签中的文字添加能被JS捕获的元素,然后再用 ...

  3. D. 停不下来的团长奥尔加 动态规划

    题目描述 分析 设\(f[i]\) 为从 \(i\) 走到 \(i+1\) 的步数 初始值 \(f[i]=2\) 则 \(f[i]=\sum_{i=p[i]}^{i}f[i]\) 考试的时候用树状数组 ...

  4. Redis常用命令(1)——Key

    DEL 格式:DEL key [key ...] 作用:删除一个或多个 key.不存在的 key 会被忽略. 返回值:被删除 key 的数量. 示例: 192.168.1.100:6379> s ...

  5. 常用数据结构-namedtuple(命名元祖)

    namedtuple从根本上来说是一个带有数据名称的元祖.它包含元祖的所有特性,但也有一些元祖没有的额外特性.使用namedtuple可以很容易创建轻量级对象类型. namedtuple将是你的代码更 ...

  6. IOCP三层结构

    iocp三层架构服务器模型 分类: GameEngine专题之IOCP(完成端口)2010-04-06 14:44 2611人阅读 评论(0) 收藏 举报 服务器socket工作测试应用服务器性能优化 ...

  7. AQS源码深入分析之共享模式-你知道为什么AQS中要有PROPAGATE这个状态吗?

    本文基于JDK-8u261源码分析 本篇文章为AQS系列文的第二篇,前文请看:[传送门] 第一篇:AQS源码深入分析之独占模式-ReentrantLock锁特性详解 1 Semaphore概览 共享模 ...

  8. [Codeforces 580D]Fizzy Search(FFT)

    [Codeforces 580D]Fizzy Search(FFT) 题面 给定母串和模式串,字符集大小为4,给定k,模式串在某个位置匹配当且仅当任意位置模式串的这个字符所对应的母串的位置的左右k个字 ...

  9. Netty源码解析 -- ChannelOutboundBuffer实现与Flush过程

    前面文章说了,ChannelHandlerContext#write只是将数据缓存到ChannelOutboundBuffer,等到ChannelHandlerContext#flush时,再将Cha ...

  10. AJAX接口-拉购网职位搜索爬虫

    拉购网职位搜索爬虫 分析职位搜索调用接口: 浏览器开发者模式(快捷键F12)切换手机模式,打开拉购网职位搜索链接 https://m.lagou.com/search.html 输入搜索关键词, 例如 ...