文档章节

js获取html元素的宽度高度及相对位置

老王哥哥
 老王哥哥
发布于 2017/08/31 10:22
字数 257
阅读 1
收藏 0

精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth 

scrollHeight: 获取对象的滚动高度。 

scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离 

scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离 

scrollWidth:获取对象的滚动宽度 

offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度 

offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置 

offsetTop:获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端位置 

event.clientX 相对文档的水平座标 

event.clientY 相对文档的垂直座标 

event.offsetX 相对容器的水平坐标 

event.offsetY 相对容器的垂直坐标 

document.documentElement.scrollTop 垂直方向滚动的值 

event.clientX+document.documentElement.scrollTop 相对文档的水平座标+垂直方向滚动的量

© 著作权归作者所有

共有 人打赏支持
上一篇: js三元运算符
老王哥哥
粉丝 0
博文 16
码字总数 9532
作品 0
德阳
私信 提问
javascript集锦(一)

javascript集锦(一): javascript作用域: function myFun(){test = 123;}myFun(); //执行myFun后, test在myFun中没有声明var, 被视作全局变量alert(test); //123 javascript闭包:闭包可以记...

ihaolin
2014/03/30
0
0
Javascript 中js语句执行顺序

如果我们把嵌入在HTML中的<script> js coding </script>看做Js代码块(实际上Js没有代码块的意义一说,如果真要看成代码块那也应该是按函数块来划分)的话,下面就是Js代码执行顺序: 这里转...

learn_more
2014/09/21
0
0
DOCTYPE声明对JS获取窗口宽度和高度的影响

摘注】:以下说法不准确,不是有没有DOCTYPE声明,而是不同的DOCTYPE声明对js的处理有影响。 在没有DOCTYPE声明的情况下: document.body.clientWidth document.body.clientHeight 为当前窗口...

囧南风囧
2010/09/25
0
0
Javascript--获取一个元素的高度和宽度

纯Javascript脚本获取元素样式 一,问题描述 有时候,我们需要做一些页面让其中的元素按照不同的显示器而自适应, 那么怎么计算这个元素的margin-top呢,我相信大家都会计算, 那么涉及到其中...

ifanjiaxin
2015/10/31
0
0
30 Seconds of CSS代码块解读(动画篇)

30 Seconds of CSS代码块解读(动画篇) 这是第三篇解读,主要包括加载效果,自定义过渡动画函数和下划线动画。其中弹跳加载很具有实用性,可以用于加载组件中,让加载效果更加个性化。 Bounci...

坤少卡卡
07/02
0
0

没有更多内容

加载失败,请刷新页面

加载更多

矿难让显卡压了那么多货咋办?NV如是说

在苏州 GTC 开幕的几天前,英伟达刚刚遭遇了一次股价的腰斩。 近来加密货币的热度渐低,受到挖矿热潮照顾许多的英伟达「矿机」销量受到打击,甚至出现了严重的库存危机,加上近来刚刚发的 RT...

linux-tao
16分钟前
1
0
Python学习日记5|BeautifulSoup中find和find_all的用法

Python学习日记5|BeautifulSoup中find和find_all的用法 是蓝先生 关注 2016.04.20 11:26* 字数 930 阅读 37205评论 11喜欢 10 今天是4.20号。 前天晚上看到蒋方舟的一句话: 不要左顾右盼。慢...

linjin200
17分钟前
1
0
浅析Vue.js 中的条件渲染指令

1 应用于单个元素 Vue.js 中的条件渲染指令可以根据表达式的值,来决定在 DOM 中是渲染还是销毁元素或组件。 html: <div id="app"><p v-if="type===1">拌面</p><p v-else-if="type==...

开元中国2015
17分钟前
1
0
聊天机器人最难理解的 10 个词汇

简评:现在,越来越多的「聊天机器人」凭借着人工智能能与人类对话,甚至编写新闻。人们该如何判断对方是一个血肉之躯,还是一个可笑的算法?又该如何判断一个小说故事是由一台机器编写的,而...

极光推送
23分钟前
1
0
开源 java CMS - FreeCMS2.8会员我的评论

项目地址:http://www.freeteam.cn/ 我的评论 从左侧管理菜单点击我的评论进入。在这里可以查看当前登录会员的所有评论记录。 删除评论 选择评论然后点击删除按钮可以完成删除操作。 为了防止...

freeteam
46分钟前
1
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部