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 盒模型 尺寸深入理解
Dec 31 Javascript
javascript对下拉列表框(select)的操作实例讲解
Nov 29 Javascript
纯JS实现动态时间显示代码
Feb 08 Javascript
js中的getAttribute方法使用示例
Aug 01 Javascript
js跨域资源共享 基础篇
Jul 02 Javascript
每个程序员都需要学习 JavaScript 的7个理由小结
Sep 03 Javascript
js实现登录验证码
Dec 22 Javascript
详解react如何在组件中获取路由参数
Jun 15 Javascript
详解React-Native解决键盘遮挡问题(Keyboard遮挡问题)
Jul 13 Javascript
jQuery获取随机颜色的实例代码
May 21 jQuery
js实现无刷新监听URL的变化示例代码详解
Jun 03 Javascript
vue单元格多列合并的实现
Nov 26 Vue.js
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
Linux下PHP加速器APC的安装与配置笔记
2014/10/24 PHP
PHP实现的json类实例
2015/07/28 PHP
php类的自动加载操作实例详解
2016/09/28 PHP
解决jquery的.animate()函数在IE6下的问题
2010/12/03 Javascript
一个轻量级的javascript库 pj介绍
2010/12/19 Javascript
一个JQuery操作Table的代码分享
2012/03/30 Javascript
javaScript中的this示例学习详解及工作原理
2014/01/13 Javascript
有关json_decode乱码及NULL的问题
2015/10/13 Javascript
JQuery核心函数是什么及使用方法介绍
2016/05/03 Javascript
javascript获取select标签选中的值
2016/06/04 Javascript
轻松掌握JavaScript代理模式
2016/08/26 Javascript
Js实现京东无延迟菜单效果实例(demo)
2017/06/02 Javascript
原生js实现密码输入框值的显示隐藏
2017/07/17 Javascript
BootStrap点击保存后实现模态框自动关闭的思路(模态框)
2017/09/26 Javascript
vue.js实现点击后动态添加class及删除同级class的实现代码
2018/04/04 Javascript
NodeJs搭建本地服务器之使用手机访问的实例讲解
2018/05/12 NodeJs
微信小程序实现日历功能
2018/11/27 Javascript
[04:32]DOTA2著名解说配音敌法师 现场专访海涛怒切假腿
2013/12/20 DOTA
[02:30]辉夜杯主赛事第二日胜者组半决赛 CDEC.Y赛后采访
2015/12/26 DOTA
python实现的防DDoS脚本
2011/02/08 Python
python中pandas.DataFrame对行与列求和及添加新行与列示例
2017/03/12 Python
Python实现好友全头像的拼接实例(推荐)
2017/06/24 Python
Python3实现发送QQ邮件功能(附件)
2020/12/23 Python
Django模型修改及数据迁移实现解析
2019/08/01 Python
一文读懂Python 枚举
2020/08/25 Python
Python3如何使用tabulate打印数据
2020/09/25 Python
python实现数学模型(插值、拟合和微分方程)
2020/11/13 Python
python tkinter实现下载进度条及抖音视频去水印原理
2021/02/07 Python
美国在线面料商店:Fashion Fabrics Club
2020/01/31 全球购物
社会工作专业求职信
2014/07/15 职场文书
人事经理岗位职责范本
2014/08/04 职场文书
论群众路线学习笔记
2014/11/06 职场文书
国庆节主题班会
2015/08/15 职场文书
2016年感恩教师节活动总结
2016/04/01 职场文书
八年级地理课件资料及考点知识分享
2019/08/30 职场文书
Java各种比较对象的方式的对比总结
2021/06/20 Java/Android