function findPosition(oElement) {
var x2 = 0;
var y2 = 0;
var width = oElement.offsetWidth;
var height = oElement.offsetHeight;
if (typeof (oElement.offsetParent) != 'undefined') {
for (var posX = 0, posY = 0; oElement; oElement = oElement.offsetParent) {
posX += oElement.offsetLeft;
posY += oElement.offsetTop;
}
x2 = posX + width;
y2 = posY + height;
//return [ posX, posY ,x2, y2];
return { x: posX, y: posY, xx: x2, yy: y2 };
} else {
x2 = oElement.x + width;
y2 = oElement.y + height;
return { x: oElement.x, y: oElement.y, xx: x2, yy: y2 };
}
}

  此方法获取到的是json格式的数据,包括元素左上角的坐标和元素的宽高。

获取html元素所在页面的坐标的更多相关文章

  1. 获取DOM元素到页面顶部的距离,亲测有效版本(转载)

    原文:https://blog.csdn.net/u013764814/article/details/83825479 干脆点(博客就应该干脆,少扯皮) DOM元素有一个属性是offsetTop,表 ...

  2. jquery获取当前鼠标所在位置的坐标

    $(document).ready(function(){ $(document).mousemove(function(e){ $('#xy').html("X :"+e.pag ...

  3. js 获取元素在页面上的偏移量的最佳方式

    使用js制作效果时,我们常常要获取某个元素在页面上的偏移量(例如tip提示框功能).而获取偏移量可以直接获取相对于document的偏移量,也可以获取相对与视口的偏移量(viewpoint)加上页面滚 ...

  4. 我的前端工具集(八)获得html元素在页面中的位置

    我的前端工具集(八)获得html元素在页面中的位置   liuyuhang原创,未经允许禁止转载 目录 我的前端工具集 有时候需要用点击等操作,来获取某元素在页面中的位置,然后在该位置添加某些操作 如 ...

  5. js 获取当前焦点所在的元素、给元素和input控件添加键盘监听事件、添加页面级的键盘监听事件

    页面级的键盘监听事件 document.onkeydown = function (event) { var e = event || window.event || arguments.callee ...

  6. js获取元素的页面坐标

    一.DOM中各种宽度.高度 二.DOM中的坐标系 JS获取div元素的宽度 offsetWidth=width+padding-left+padding-right+border-left+borde ...

  7. jquery获取当前元素的坐标

    jquery获取当前元素的坐标 1,获取对象 var obj = $("#id号"); 或  var obj = $(this); 实例中我获取的对象是弹出窗口按钮,这样创建的新窗 ...

  8. jquery获取元素到页面顶部距离

    jquery获取元素到页面顶部距离的语句为: $(selector).offset().top

  9. jquery获取当前元素坐标

    1. jquery获取当前元素坐标 A) 获取对象

随机推荐

  1. CSAPP:异常控制流

    在一般的情况下,处理器处理的指令序列是相邻的(顺序执行). 异常控制流提供了指令的跳转,它一部分是由硬件实现的,一部分是由操作系统实现的. 异常处理 在系统启动时,操作系统分配和初始化一张称为异常表的 ...

  2. 【DB2】对两列分组之后判断另外一列是否有重复

    建立表数据如下: ),sex ),sex_nm ),OWER ),TYPE ),TYPE_NM )); ,','水果'), (,','水果'), (,','水果'), (,','水果'), (,',' ...

  3. rtp协议详解/rtcp协议详解

    转自:http://www.cnblogs.com/li0803/archive/2010/11/20/1882792.html 1.简介 目前,在IP网络中实现实时语音.视频通信和应用已经成为网络应 ...

  4. Android中图片的三级缓存策略

    在开发过程中,经常会碰到进行请求大量的网络图片的样例.假设处理的不好.非常easy造成oom.对于避免oom的方法,无非就是进行图片的压缩.及时的回收不用的图片.这些看似简单可是处理起来事实上涉及的知 ...

  5. C++语言基础(17)-运算符重载

    运算符重载的格式为: 返回值类型 operator 运算符名称 (形参表列){ //TODO: } 一.在类里面实例运行符重载 #include <iostream> using name ...

  6. __attribute__系列之aligned

    __attribute__的属性aligned,作用是为了设置字节对齐. aligned是对 变量和结构体进行 字节对齐的属性设置. 通过aligned属性设置(aligned(对齐字节数)),可以显 ...

  7. mac 火狐 下载 任何文件都是失败

    今天在从邮件中下载附件,怎么点击下载 浏览器上都是失败 最后突然想到,我改过火狐的下载路径,改到根目录下了,根目录下应该是没有权限保存文件的 后把下载路径改成 “下载” 就可以正常下载了

  8. Java并发编程(十一)实例封闭

    本节主题:如果一个类是线程不安全的,但是又要在多线程程序中安全地使用,你该怎么办? 大体有两种思路: 第一种:确保该对象是能由单个线程访问,也就是这个对象是被封闭在线程中的: 第二种:通过锁来对该对象 ...

  9. input子系统分析(转)

    转自:http://www.linuxidc.com/Linux/2011-09/43187.htm 作者:作者:YAOZHENGUO2006 Input子系统处理输入事务,任何输入设备的驱动程序都可 ...

  10. 6.5安装nagios

    最近因为,科研需要,接触上了Nagios,这里,我将安装笔记做个详解.为自己后续需要和博友们学习! VMware workstation 11 的下载 VMWare Workstation 11的安装 ...