jQuery简单获取DIV和A标签元素位置的方法


Posted in Javascript onFebruary 07, 2017

本文实例讲述了jQuery简单获取DIV和A标签元素位置的方法。分享给大家供大家参考,具体如下:

一、获取DIV的位置

var top = jquery("#div_id").offset().top; //获取div的居上位置
var left = jquery("#div_id").offset().left; //获取div的居左位置
var height = jquery("#div_id").height(); //获取div的高度
var width = jquery("#div_id").width(); //获取div的宽度
jquery("#div_id").css({'top':top,'left':left,'height':height,'width':width}); //设置DIV的css属性

二、获取A标签的位置

<a href="http://localhost/#" rel="external nofollow" onclick="javascript:get_a(this,1)">获取A标签的位置</a>
<script language="javascript">
function get_a(thisObj,param){
 var top = jquery(thisObj).offset().top;
 var left = jquery(thisObj).offset().left;
 var height = jquery(thisObj).height();
 var width = jquery(thisObj).width();
}
</script>

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
JavaScript入门教程 Cookies
Jan 31 Javascript
使用Json比用string返回数据更友好,也更面向对象一些
Sep 13 Javascript
js判断是否为数组的函数: isArray()
Oct 30 Javascript
Javascript之this关键字深入解析
Nov 12 Javascript
浅谈jQuery页面的滚动位置scrollTop、scrollLeft
May 19 Javascript
使用canvas实现仿新浪微博头像截取上传功能
Sep 02 Javascript
深入浅析react native es6语法
Dec 09 Javascript
JavaScript实现邮箱地址自动匹配功能代码
Nov 28 Javascript
支付宝小程序自定义弹窗dialog插件的实现代码
Nov 30 Javascript
原生JS实现顶部导航栏显示按钮+搜索框功能
Dec 25 Javascript
JavaScript 正则应用详解【模式、欲查、反向引用等】
May 13 Javascript
微信小程序实现登录注册功能
Dec 29 Javascript
JS日程管理插件FullCalendar简单实例
Feb 07 #Javascript
纯js三维数组实现三级联动效果
Feb 07 #Javascript
在点击div中的p时,如何阻止事件冒泡
Feb 07 #Javascript
bootstrap vue.js实现tab效果
Feb 07 #Javascript
Node连接mysql数据库方法介绍
Feb 07 #Javascript
jQuery监听浏览器窗口大小的变化实例
Feb 07 #Javascript
Bootstrap table表格简单操作
Feb 07 #Javascript
You might like
PHP中使用cURL实现Get和Post请求的方法
2013/03/13 PHP
PHPExcel在linux环境下导出报500错误的解决方法
2017/01/26 PHP
支持汉转拼和拼音分词的PHP中文工具类ChineseUtil
2018/02/23 PHP
Laravel服务容器绑定的几种方法总结
2020/06/14 PHP
JQuery AJAX实现目录浏览与编辑的代码
2008/10/21 Javascript
Javascript 继承实现例子
2009/08/12 Javascript
js对table的td进行相同内容合并示例详解
2013/12/27 Javascript
js打开新窗口方法整理
2014/02/17 Javascript
jQuery.extend()、jQuery.fn.extend()扩展方法示例详解
2014/05/08 Javascript
JavaScript中创建字典对象(dictionary)实例
2015/03/31 Javascript
javascript 实现map集合
2015/04/03 Javascript
jQuery根据用户电脑是mac还是pc加载对应样式的方法
2015/06/26 Javascript
jQuery使用animate创建动画用法实例
2015/08/07 Javascript
js重写方法的简单实现
2016/07/10 Javascript
node.js 和HTML5开发本地桌面应用程序
2016/12/13 Javascript
js编写三级联动简单案例
2016/12/21 Javascript
vue音乐播放器插件vue-aplayer的配置及其使用实例详解
2017/07/10 Javascript
vue项目总结之文件夹结构配置详解
2017/12/13 Javascript
使用Nuxt.js改造已有项目的方法
2018/08/07 Javascript
JS使用栈判断给定字符串是否是回文算法示例
2019/03/04 Javascript
JS闭包原理及其使用场景解析
2020/12/03 Javascript
python opencv实现运动检测
2018/07/10 Python
python使用threading.Condition交替打印两个字符
2019/05/07 Python
Python assert语句的简单使用示例
2019/07/28 Python
对python中的*args与**kwgs的含义与作用详解
2019/08/28 Python
Python数据可视化:箱线图多种库画法
2019/11/06 Python
python3 使用Opencv打开USB摄像头,配置1080P分辨率的操作
2019/12/11 Python
基于python实现模拟数据结构模型
2020/06/12 Python
Python创建简单的神经网络实例讲解
2021/01/04 Python
遮罩层 + Iframe实现界面自动显示的示例代码
2020/04/26 HTML / CSS
使用layui实现左侧菜单栏及动态操作tab项的方法
2020/11/10 HTML / CSS
英国比较机场停车场网站:Airport Parking Essentials
2019/12/01 全球购物
GC是什么?为什么要有GC?
2013/12/08 面试题
生日答谢词
2015/01/05 职场文书
开学典礼致辞
2015/07/29 职场文书
Jmerte 分布式压测及分布式压测配置
2022/04/30 Java/Android