<!DOCTYPE html>
 <html lang="en">
 <head>
     <meta charset="UTF-8">
     <title>获取div相对屏幕于左上角的绝对位置</title>
 </head>
 <body>
     <div class="div1"></div>
     <script>
         //返回值是一个包含width height top right bottom left的对象
         var rect = document.querySelector('.div1').getBoundingClientRect()
 　　　　 console.log(rect);
     </script>
 </body>
 </html>

获取div或者元素相对于屏幕坐上角的绝对位置的更多相关文章

  1. js获取div基础元素

    1.js获取div元素 clientHeight 获取对象的高度,不计算任何边距.边框.滚动条,但包括该对象的补白. clientLeft 获取 offsetLeft 属性和客户区域的实际左边之间的距 ...

  2. [jquery]高级篇--获取div子元素

    参考: http://zhidao.baidu.com/link?url=IfeQQBn1xMLqWvwdkKbQYJ8mC6ciGi_8M1NYkm6iQ-kXBMX2f2ylN-ckzFLiynn ...

  3. js如何获取隐藏的元素的高度

    首先,正常情况下,确保div是有高度的. <!DOCTYPE html> <html lang="en"> <head> <meta ch ...

  4. JQuery 获取父级元素、同级元素、子元素等

    例: <div> <div id="div_1">这是内容1</div> <div id="div_2">这是内 ...

  5. jquery选择器 之 获取父级元素、同级元素、子元素

    jquery选择器 之 获取父级元素.同级元素.子元素 一.获取父级元素 1. parent([expr]): 获取指定元素的所有父级元素 <div id="par_div" ...

  6. jquery选择器如何获取父级元素、同级元素、子元素

    一.新建页面 <ul> <li>list item 1</li> <li>list item 2</li> <li class=&qu ...

  7. 获取DIV与浏览器顶部相聚一定位置之后移动DIV

    获取元素(这里定位元素A)距离顶部的高度,接着设定scroll滚动的事件,比如超过那个高度,把A的位置设定为fixed,小于该高度,修改回relative. 方法一: $(function() {  ...

  8. Jquery 方式获取 iframe Dom元素

    Jquery 方式获取 iframe Dom元素 測试页面代码: <html>  <head>   <title>jquery方式,訪问iframe页面dom元素& ...

  9. jquery1.11 操作checkbox：全选、取消全选、获取选择元素、获取取消选择元素（总结）

    jquery1.11.1版本完成对checkbox的操作 1. 使用属性prop设置选中状态 2.使用:checked和:not(:checked)获取选中的元素 源码: <!DOCTYPE h ...

随机推荐

  1. 委托学习笔记后续：泛型委托及委托中所涉及到匿名方法、Lambda表达式

    引言: 最初学习c#时,感觉委托.事件这块很难,其中在学习的过程中还写了一篇学习笔记:委托.事件学习笔记.今天重新温故委托.事件,并且把最近学习到和委托相关的匿名方法.Lambda表达式及泛型委托记录 ...

  2. Magento的基本架构解析

    Magento的基本架构解析 magento 是在Zend框架基础上建立起来的,这点保证了代码的安全性及稳定性.选择Zend的原因有很多,但是最基本的是因为 zend框架提供了面向对象的代码库并且有很 ...

  3. 从 IClassFactory 为 CLSID 为 {00024500-0000-0000-C000-000000000046} 的 COM 组件创建实例失败，原因是出现以下错误: 8001010a解决办法

    1.在命令行中输入:dcomcnfg,会显示出“组件服务”管理器 2.打开“组件服务->计算机->我的电脑->DCOM 配置”,找到“Microsoft Word文档”,单击右键,选 ...

  4. leetcode 155

    题目描述: Design a stack that supports push, pop, top, and retrieving the minimum element in constant ti ...

  5. python入门到精通[三]:基础学习(2)

    摘要:Python基础学习:列表.元组.字典.函数.序列化.正则.模块. 上一节学习了字符串.流程控制.文件及目录操作,这节介绍下列表.元组.字典.函数.序列化.正则.模块. 1.列表 python中 ...

  6. DataTable 转 List<T>

    最近在做一个项目,表的数据巨多,而且表的字段一般都在30个以上.公司规定不能用Nhibernate以及ef等ORM框架. 所以查询绑定时的工作量极为痛苦.没有办法,自己写了个DataTableToLi ...

  7. PostgreSQL Replication之第一章 理解复制概念（1）

    PostgreSQL Replication系列翻译自PostgreSQL Replication一书 在本章中,将会介绍不同的复制概念,您会了解哪些类型的复制对哪一种实用场景是最合适的. 在本章的最 ...

  8. jdbc 数据的增删改查的Statement Resultset PreparedStatement

    完成数据库的连接,就马上要对数据库进行增删改查操作了:先来了解一下Statement 通过JDBC插入数据 (这里提供一个查找和插入方法) Statement:用于执行sql语句的对象: *1.通过C ...

  9. c++的构造函数

    我刚学的知识:c++的构造函数.在在此之前一直都处于迷惑之中,现在怕忘.所以赶紧把他写下来,用来以后复习,可能有错误的地方,请大牛们指出来.c++知识相对与c来说更加抽象,但真明白了,也就那一回事.这 ...

  10. Ref和Out参数的区别(转帖）

    首先,如果不使用这两个关键字,那是什么样 呢? 看下面的例子: using System;   class Test   {   static void Swap(ref int x, ref int ...