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 ...
随机推荐
- fir.im Weekly - 可能是 2017 最好的 Swift 学习资源
春节假期刚结束,一大批新鲜干货就来了.@故胤道长 分享了一份开源 Swift30 Projects ,内含 30 个小App,更新至 Swift 3.0,目前更迭的这个版本更注重代码规范和架构设计,且 ...
- DB2 表空间监控
默认DB2 缓冲池信息监控是OFF, 需要开启(DB2表空间是由缓冲池分配的) CollBufferpool : ============ The CollBufferpool collector c ...
- 匹配PC和移动端
方法1: var browser={ versions:function(){ var u = navigator.userAgent, app = navigator.appVersion; ret ...
- JAVA的SSH框架登录注册
Struts 的MVC设计模式可以使我们的逻辑变得很清晰,主要负责表示层的显示. Spring 的IOC和AOP可以使我们的项目在最大限度上解藕. hibernate的就是实体对象的持久化了, 数据库 ...
- c++编程思想(一)--对象导言
回过头来看c++编程思想第一章,虽然只是对c++知识的一个总结,并没有实质性知识点,但是收获还是蛮多的! 下面感觉是让自己茅塞顿开的说法,虽然含义并不是很准确,但是很形象(自己的语言): 1.类描述了 ...
- Lua与.net的CLR相互调用
工程环境搭建: 下载luainterface-1.5.3.zip文件,使用到的dll为Built目录下的LuaInterface.dll.lua51.dll.luanet.dll LuaInterfa ...
- 实例了解js面向对象的封装和继承等特点
1.面向对象特点 相比之前按照过程式写法,面向对象有以下几个特点; 1.抽象:抓住核心问题,就是将很多个方法放在一个对象上.对象由属性和方法组成,属性就是我们定义的变量,它是静态的:方法就是行为操作, ...
- 虚拟机Centos开机以后,有eth0网卡,但是没有IP,Determine IP information for eth0.. no link present check cable
Determine IP information for eth0.. no link present check cable 如果你的VMware虚拟机centos6.5使用NAT模式,开机以后,使 ...
- Kafka概述与设计原理
kafka是一种高吞吐量的分布式发布订阅消息系统,有如下特性: 1. 通过O(1)的磁盘数据结构提供消息的持久化,这种结构对于即使数以TB的消息存储也能够保持长时间的稳定性能. 2 .高吞吐量:即使是 ...
- ASP.NET通用权限框架 权限管理系统源码jquery 精美UI源码
软件技术开发,合作请联系QQ:858-048-581 开发工具 VS2010 .sql2005.2008等(在Sql server数据执行脚本即可) VS2010 打开保证本地运行成功(数据库.源代 ...