网页被卷起来的高度/宽度

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获取元素位置属性及兼容性写法的更多相关文章

  1. js获取元素位置和style的兼容性写法

    今天说一下js获取元素位置和style的方法.当然不只是element.style那么简单.. 主角:getBoundingClientRect,getClientRects,getComputedS ...

  2. 【全面总结】js获取元素位置大小

    [js获取元素位置+元素大小]全面总结 目录 1.关于offset offsetParent(只读) offsetTop(只读) offsetLeft(只读) offsetHeight(只读) off ...

  3. JQ方法实用案例///鼠标移动到div和修改ipt中弹窗、CSS鼠标变小手、JQ获取元素属性、JQ选择器

    今天学习了jQ,jQ对js的帮助很大,菜鸟教程上也有属性.可以查看 js 和 jquery主要的区别 在 dom    想用jquery  必须先引入(顺序问题)        先css 再js:   ...

  4. 原生JS与JQ获取元素的区别

    刚学JQ不久,有时候可能会把JS和JQ获取元素的方式搞错,接下来获取属性方法什么的就一发不可收拾了,现在把两者获取获取元素的代码整理下. 一.原生JS获取元素. 1.常用的三种方式获取元素对象(将指定 ...

  5. JS中获取元素属性的逆天大法

    给大家聊下js中获取元素属性的逆天大法,胆小慎入,切记切记!!! innerHTML.outerHTML.innerText .outerText.value.text().html(),val() ...

  6. Selenium2学习-031-WebUI自动化实战实例-029-JavaScript 在 Selenium 自动化中的应用实例之四(获取元素位置和大小)

    通过 JS 或 JQuery 获取到元素后,通过 offsetLeft.offsetTop.offsetWidth.offsetHeight 即可获得元素的位置和大小,非常的简单,直接上源码了,敬请参 ...

  7. js兼容获取元素的样式

    js获取元素的样式的兼容性处理: function getStyle(obj,attr){ return obj.currentStyle?obj.currentStyle[attr]:getComp ...

  8. jq获取鼠标位置

    jq获取鼠标位置 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  9. js中获取css样式属性值

    关于js中style,currentStyle和getComputedStyle几个注意的地方 (1)用js的style只能获取元素的内联样式,内部样式和外部样式使用style是获取不到的.针对css ...

随机推荐

  1. fir.im Weekly - 可能是 2017 最好的 Swift 学习资源

    春节假期刚结束,一大批新鲜干货就来了.@故胤道长 分享了一份开源 Swift30 Projects ,内含 30 个小App,更新至 Swift 3.0,目前更迭的这个版本更注重代码规范和架构设计,且 ...

  2. DB2 表空间监控

    默认DB2 缓冲池信息监控是OFF, 需要开启(DB2表空间是由缓冲池分配的) CollBufferpool : ============ The CollBufferpool collector c ...

  3. 匹配PC和移动端

    方法1: var browser={ versions:function(){ var u = navigator.userAgent, app = navigator.appVersion; ret ...

  4. JAVA的SSH框架登录注册

    Struts 的MVC设计模式可以使我们的逻辑变得很清晰,主要负责表示层的显示. Spring 的IOC和AOP可以使我们的项目在最大限度上解藕. hibernate的就是实体对象的持久化了, 数据库 ...

  5. c++编程思想(一)--对象导言

    回过头来看c++编程思想第一章,虽然只是对c++知识的一个总结,并没有实质性知识点,但是收获还是蛮多的! 下面感觉是让自己茅塞顿开的说法,虽然含义并不是很准确,但是很形象(自己的语言): 1.类描述了 ...

  6. Lua与.net的CLR相互调用

    工程环境搭建: 下载luainterface-1.5.3.zip文件,使用到的dll为Built目录下的LuaInterface.dll.lua51.dll.luanet.dll LuaInterfa ...

  7. 实例了解js面向对象的封装和继承等特点

    1.面向对象特点 相比之前按照过程式写法,面向对象有以下几个特点; 1.抽象:抓住核心问题,就是将很多个方法放在一个对象上.对象由属性和方法组成,属性就是我们定义的变量,它是静态的:方法就是行为操作, ...

  8. 虚拟机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模式,开机以后,使 ...

  9. Kafka概述与设计原理

    kafka是一种高吞吐量的分布式发布订阅消息系统,有如下特性: 1. 通过O(1)的磁盘数据结构提供消息的持久化,这种结构对于即使数以TB的消息存储也能够保持长时间的稳定性能. 2 .高吞吐量:即使是 ...

  10. ASP.NET通用权限框架 权限管理系统源码jquery 精美UI源码

    软件技术开发,合作请联系QQ:858-048-581 开发工具 VS2010 .sql2005.2008等(在Sql server数据执行脚本即可)  VS2010 打开保证本地运行成功(数据库.源代 ...