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

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. Ninject之旅目录

    第一章:理解依赖注入 Ninject之旅之一:理解DI 第二章:开始使用Ninject Ninject之旅之二:开始使用Ninject(附程序下载) Ninject之旅之三:Ninject对象生命周期 ...

  2. c#入门系列——番外篇:vs的安装与使用

    vs的安装 1.安装条件          vs全称visual studio 它是一个开发平台,不仅可以用于c#开发,别的也可以.安装vs前,首先需要一个安装包.安装包可以在网上下载.没有购买版权的 ...

  3. sql递归查询语句

    sql Bom 递归查询: with t as(select * from Department where id=6union allselect a.* from Department a,t w ...

  4. SharePoint 2016 文档库的新功能简介

    今天,重装了一下SharePoint 2016,想多了解了解,看到一些自己平时没注意的功能,或者新的功能,分享一下给大家. 1.界面上操作的变换,多了一排按钮,更像SharePoint Online了 ...

  5. SpringMVC简版教程、部分功能

    注:本文只用注解来实现 前言 SpringMVC各种流程图流程图(其他的各种流程图) jsp.xml.action彼此之间的关系,都如何使用 spring-mvc.xml如何配置,放在哪里? acti ...

  6. ubuntu ssh-keygen Permission denied

    ubuntu下生成github上的ssh keys,执行: ssh-keygen 直接执行: sudo chown user1:user1 /home/user1/.ssh -R 成功生成.

  7. class和id的区别

    我们平常在用DIV CSS制作Xhtml网页页面时,常会用到class 和id来选择调用CSS样式属性.对学习CSS的新手来说class和id可能比较模糊,同时不知道什么时候该用class,什么时候又 ...

  8. 这是一款可以查阅Github上的热门趋势的APP

    随时查阅当前Github上的热门趋势.使用Material Design设计风格,和流行的MVP+Retrofit+RxJava框架.数据抓取自https://github.com/trending ...

  9. Spring源码解析三:IOC容器的依赖注入

    一般情况下,依赖注入的过程是发生在用户第一次向容器索要Bean是触发的,而触发依赖注入的地方就是BeanFactory的getBean方法. 这里以DefaultListableBeanFactory ...

  10. poj 2236

    Wireless Network Time Limit: 10000MS   Memory Limit: 65536K Total Submissions: 25817   Accepted: 107 ...