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

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. tomcat启动异常、和web.xml缺少配置异常

    错误如下: 14-Feb-2017 10:50:00.665 SEVERE [RMI TCP Connection(3)-127.0.0.1] org.apache.catalina.core.Sta ...

  2. 5天2亿活跃用户,QQ“LBS+AR”天降红包活动后台揭密

    作者:Dovejbwang,腾讯后台开发工程师,参与“LBS+AR”天降红包项目,其所在“2016春节红包联合项目团队”获得2016公司级业务突破奖. 商业转载请联系腾讯WeTest获得授权,非商业转 ...

  3. Python之文件与目录操作及压缩模块(os、shutil、zipfile、tarfile)

    Python中可以用于对文件和目录进行操作的内置模块包括: 模块/函数名称 功能描述 open()函数 文件读取或写入 os.path模块 文件路径操作 os模块 文件和目录简单操作 zipfile模 ...

  4. 使用JDT.AST解析java源码

    在做java源码的静态代码审计时,最基础的就是对java文件进行解析,从而获取到此java文件的相关信息: 在java文件中所存在的东西很多,很复杂,难以用相关的正则表达式去一一匹配.但是,eclip ...

  5. linux系统端口查看和占用的解决方案

    使用netstat命令查看端口占用情况 netstat -tln 查看什么程序占用端口 netstat -tlnp 过滤端口 netstat -tlnp |grep  8080 杀掉进程 kill - ...

  6. nginx内置全局变量

    nginx内置全局变量 $args        请求中的参数; $binary_remote_addr        远程地址的二进制表示 $body_bytes_sent        已发送的消 ...

  7. C语言中NULL的定义

    用C语言编程不能不说指针,说道指针又不能不提NULL,那么NULL究竟是个什么东西呢? C语言中又定义,定义如下: #undef NULL #if defined(__cplusplus) #defi ...

  8. SqlService性能检测和优化工具

    工具概要 如果你的数据库应用系统中,存在有大量表,视图,索引,触发器,函数,存储过程,sql语句等等,又性能低下,而苦逼的你又要对其优化,那么你该怎么办?哥教你,首先你要知道问题出在哪里?如果想知道问 ...

  9. WebStorm 自定义字体+颜色+语法高亮+导入导出用户设置

    WebStorm :是jetbrains公司旗下一款JavaScript 开发工具.被广大中国JS开发者誉为“Web前端开发神器”.“最强大的HTML5编辑器”.“最智能的JavaScript IDE ...

  10. Spring MVC + Security 4 初体验(Java配置版)

    spring Version = 4.3.6.RELEASE springSecurityVersion = 4.2.1.RELEASE Gradle 3.0 + Eclipse Neno(4.6) ...