js,jq获取元素位置属性及兼容性写法
网页被卷起来的高度/宽度
document.documentElement.scrolltop //火狐 和 其他浏览器
document.body.scrolltop //ie,谷歌浏览器和没有声明DTD
window.pageYOffset window.pageYOffset // ie9+ 和 最新浏览器
$(window).scrollTop()
元素距离文档顶端和左端的偏移量
dom元素.offsetTop //chrome,ie 子盒子到定位的父盒子边框到边框的距离
dom元素.offsetLeft //chrome,ie
jq对象.offset().top
jq对象.offset().left
获取元素的宽度,高度
dom元素.clientWidth //width+padding
dom元素.clientHeight
dom元素.offsetWidth // width+padding+border
jq对象.width()
jq对象.height()
获取窗口的大小
window.innerWidth //ie9+及最新,谷歌
document.documentElement.clientWidth //标准浏览器
document.body.clientWidth 怪异浏览器
$(window).width();
js,jq获取元素位置属性及兼容性写法的更多相关文章
- js获取元素位置和style的兼容性写法
今天说一下js获取元素位置和style的方法.当然不只是element.style那么简单.. 主角:getBoundingClientRect,getClientRects,getComputedS ...
- 【全面总结】js获取元素位置大小
[js获取元素位置+元素大小]全面总结 目录 1.关于offset offsetParent(只读) offsetTop(只读) offsetLeft(只读) offsetHeight(只读) off ...
- JQ方法实用案例///鼠标移动到div和修改ipt中弹窗、CSS鼠标变小手、JQ获取元素属性、JQ选择器
今天学习了jQ,jQ对js的帮助很大,菜鸟教程上也有属性.可以查看 js 和 jquery主要的区别 在 dom 想用jquery 必须先引入(顺序问题) 先css 再js: ...
- 原生JS与JQ获取元素的区别
刚学JQ不久,有时候可能会把JS和JQ获取元素的方式搞错,接下来获取属性方法什么的就一发不可收拾了,现在把两者获取获取元素的代码整理下. 一.原生JS获取元素. 1.常用的三种方式获取元素对象(将指定 ...
- JS中获取元素属性的逆天大法
给大家聊下js中获取元素属性的逆天大法,胆小慎入,切记切记!!! innerHTML.outerHTML.innerText .outerText.value.text().html(),val() ...
- Selenium2学习-031-WebUI自动化实战实例-029-JavaScript 在 Selenium 自动化中的应用实例之四(获取元素位置和大小)
通过 JS 或 JQuery 获取到元素后,通过 offsetLeft.offsetTop.offsetWidth.offsetHeight 即可获得元素的位置和大小,非常的简单,直接上源码了,敬请参 ...
- js兼容获取元素的样式
js获取元素的样式的兼容性处理: function getStyle(obj,attr){ return obj.currentStyle?obj.currentStyle[attr]:getComp ...
- jq获取鼠标位置
jq获取鼠标位置 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...
- js中获取css样式属性值
关于js中style,currentStyle和getComputedStyle几个注意的地方 (1)用js的style只能获取元素的内联样式,内部样式和外部样式使用style是获取不到的.针对css ...
随机推荐
- PLSQL程序流程
IF语句结构: if(条件表达式)- -then- -执行语句;- -end; IF-THEN-ELSE语句结构: if(条件表达式)- -then- -执行语句;- -else- -执行语句;- e ...
- Android Studio --“Cannot resolve symbol” 解决办法
鼠标放上去后显示 “Cannot resolve symbol XXX”,重启 Android Studio,重新 sync gradle,Clean build 都没有用. 多半是因为 Androi ...
- MySQL索引创建、删除、查看
主键索引 PRIMARY KEY索引仅是一个具有名称PRIMARY的UNIQUE索引.这表示一个表只能包含一个PRIMARY KEY,因为一个表中不可能具有两个同名的索引. ALTER TABLE ...
- class和id的区别
我们平常在用DIV CSS制作Xhtml网页页面时,常会用到class 和id来选择调用CSS样式属性.对学习CSS的新手来说class和id可能比较模糊,同时不知道什么时候该用class,什么时候又 ...
- Giraph入门
概要 这是一个Giraph的入门教程,主要用来运行少量输入的Giraph程序,并不能用于生产环境. 在这个教程中,我们将会在一个物理机器行部署一个单节点,伪分布的Hadoop集群.这个节点既是mast ...
- java 解析json
例<解析评论> //post方式请求 String url=“http://product.dangdang.com/comment/comment.php?product_id=6056 ...
- win8 wifi开关显示关闭,且设置里面wifi开关显示灰色的解决办法
只要从华硕官网下载驱动,电源管理驱动,安装下面显示的几个软件即可,然后重启电脑,即可看见wifi热点,另外设置里面的wifi开关也将显示正常(刚开始安装了个驱动人生根本没用,最后在华硕官网下载了个电源 ...
- windows service宿主web api使用"依赖注入"和“控制反转”的技术实践
前言 自从几年前抛弃wcf,使用web api 来做服务器端开发之后,就不再迷惑了.但是因为本来从事传统行业管理软件开发,一般都以分布式应用开发为主.纯BS还是比较少,于是比较喜欢用windows s ...
- ROJ 1166 超级贞鱼
1166: 超级贞鱼 Time Limit: 1 Sec Memory Limit: 128 MB [Submit][Status] 传送门 Description 马达加斯加贞鱼是一种神奇的双脚贞 ...
- 定制Maven的ArcheType
根据需要定制Maven的ArcheType的好处不言而喻了,我就不再啰嗦.定制一般通过从Maven的项目构建,比手动构建省去了配置文件的编写.资源文件的复制等繁琐的操作,下面我们就说下从Maven项目 ...