1.offsetTop     :

当前对象到其上级层顶部的距离.

不能对其进行赋值.设置对象到页面顶部的距离请用style.top属性.

2.offsetLeft    :

当前对象到其上级层左边的距离.

不能对其进行赋值.设置对象到页面左部的距离请用style.left属性.

3.offsetWidth   :

当前对象的宽度.

与style.width属性的区别在于:如对象的宽度设定值为百分比宽度,则无论页面变大还是变小,style.width都返回此百分比,而offsetWidth则返回在不同页面中对象的宽度值而不是百分比值

4.offsetHeight :

与style.height属性的区别在于:如对象的宽度设定值为百分比高度,则无论页面变大还是变小,style.height都返回此百分比,而offsetHeight则返回在不同页面中对象的高度值而不是百分比值

5.offsetParent  :

当前对象的上级层对象.

注意.如果对象是包括在一个DIV中时,此DIV不会被当做是此对象的上级层,(即对象的上级层会跳过DIV对象)上级层是Table时则不会有问题.

利用这个属性,可以得到当前对象在不同大小的页面中的绝对位置.

6.scrollLeft    :

对象的最左边到对象在当前窗口显示的范围内的左边的距离.

即是在出现了横向滚动条的情况下,滚动条拉动的距离.

7.scrollTop

对象的最顶部到对象在当前窗口显示的范围内的顶边的距离.

即是在出现了纵向滚动条的情况下,滚动条拉动的距离.

setOff与scrollTop区别的更多相关文章

  1. offsetTop,offsetHeight,clientHeight,scrollHeight,scrollTop区别

    这些高度相信很多同学都搞不清楚吧.这里我通过本地测试,发现了区别. 以聊天窗口为例. 元素(class='content')高度444px,其中上下padding分别是10px,margin为0.距离 ...

  2. offsetheight 和clientheight、scrollheight、scrollTop区别

    clientHeight:元素客户区的大小,指的是元素内容及其边框所占据的空间大小(经过实践取出来的大多是视口大小) scrollHeight: 滚动大小,指的是包含滚动内容的元素大小(元素内容的总高 ...

  3. jquery 对象的 height、innerHeight、outerHeight 的区别以及DOM 元素的 clientHeight、offsetHeight、scrollHeight、offsetTop、scrollTop

    前言:jquery 对象的 height.innerHeight.outerHeight,还有 DOM 元素的 clientHeight.offsetHeight.scrollHeight.offse ...

  4. vue中检测敏感词,锚点

    当发布文章的时候,标题有敏感词 则检测有敏感词的接口成功的时候,写锚点 eg: _this .$alert("检测到标题有敏感词,请修改后再发布", "提示", ...

  5. js中top、clientTop、scrollTop、offsetTop的区别 文字详细说明版【转】

    之前在修改IE6下的一个显示bug时,查到过这些,贴这备忘,后面给出了详细说明,以前的版本,没仔细的说明,特希望大家也收藏下.   网页可见区域宽: document.body.clientWidth ...

  6. scrollTop和offsetTop的区别,scrollTopLeft和offsetLeft的区别

    scrollTop和offsetTop的区别:scrollTop是指某个可滚动区块向下滚动的距离,比如向下滚动了10个像素,那么这个元素的scrollTop属性值就是10,这个属性的值是可读写的,且不 ...

  7. javascript中scrollTop和offsetTop的区别

    scrollTop是指某个可滚动区块向下滚动的距离,offsetTop则是元素的上边框与父元素的上边框的绝对距离. 1.offsetTop   : 当前对象到其上级层顶部的距离. 不能对其进行赋值.设 ...

  8. offsetHeight,scrollHeight,clientHeight,scrollTop以及pageX,clientX,offsetX,screenX,offsetLeft,style.left等的区别以及使用详解

    一.写在前面 在阅读本文前,希望大家能针对每个属性亲手测试,网上现有的大量相关博客都有不等的概念错误,毕竟亲手实践才能更好的掌握这些概念. 1.pageX,clientX,screenX与offset ...

  9. js中top、clientTop、scrollTop、offsetTop的区别 文字详细说明版

    网页可见区域宽: document.body.clientWidth;网页可见区域高: document.body.clientHeight;网页可见区域宽: document.body.offset ...

随机推荐

  1. [USACO16OPEN]248 G——区间dp

    [USACO16OPEN]248 G 题目描述 Bessie likes downloading games to play on her cell phone, even though she do ...

  2. 「JLOI2015」城池攻占 可并堆

    传送门 分析 如果直接暴力枚举的话肯定会超时 我们可以从下往上遍历,维护一个小根堆 每次到达一个节点把战败的骑士扔出去 剩下的再继续向上合并,注意要维护一下其实的战斗力 可以像线段树那样用一个lazy ...

  3. Java编程技术之浅析Java容器技术

    Java容器 集合是一种存储数据的容器,是Java开发中使用最频繁的对象类型之一. 或许提起Collection,都会第一时间意识到List和Set以及Map等相关关键词.因为这几乎是我们日常开发里接 ...

  4. 钉钉内置的浏览器怎么改变title

    在我项目的开发过程当中,遇到过在钉钉打开的vue写的h5页面,通过在路由切换的时候通过全局的路由钩子函数改变 document.title 的内容失效的问题. const routes = [ { p ...

  5. Linux多任务编程之四:exit()函数及其基础实验(转)

    来源:CSDN  作者:王文松   转自Linux公社 exit()和_exit()函数 函数说明 创建进程使用fork()函数,执行进程使用exec函数族,终止进程则使用exit()和_exit() ...

  6. 普通平衡树学习笔记之Splay算法

    前言 今天不容易有一天的自由学习时间,当然要用来"学习".在此记录一下今天学到的最基础的平衡树. 定义 平衡树是二叉搜索树和堆合并构成的数据结构,它是一 棵空树或它的左右两个子树的 ...

  7. element-ui 表单校验 Rules 配置 常用黑科技

    type 指示type要使用的验证器.可识别的类型值为: string:类型必须为string.type 默认是 string // 校验 string: [ {type: 'string', mes ...

  8. java 基本语法(十三) 数组(六)数组的常见异常

    1.数组角标越界异常:ArrayIndexOutOfBoundsException int[] arr = new int[]{1,2,3,4,5}; // for(int i = 0;i <= ...

  9. ShaderLab-坐标转换

    观察空间就是相机的空间 投影矩阵本质就是对x.y.z分量进行不同程度的缩放(z还做了平移),结果就是视锥体近切面远切面变成正方形.视锥体的中心在(0,0). (对于正交相机,这一步已经得到了立方体) ...

  10. redis入门指南(五)—— 复制与哨兵

    写在前面 学习<redis入门指南>笔记,结合实践,只记录重要,明确,属于新知的相关内容. 一.复制 1.在复制中,数据库分为两类,一类主数据库,一类从数据库,主库用来读写,从库用来读,主 ...