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 相关文章推荐
选择器中含有空格在使用示例及注意事项
Jul 31 Javascript
省市区三级联动jquery实现代码
Apr 15 Javascript
Mongoose学习全面理解(推荐)
Jan 21 Javascript
AngularJS页面传参的5种方式
Apr 01 Javascript
bootstrap轮播图示例代码分享
May 17 Javascript
Javascript别踩白块儿(钢琴块儿)小游戏实现代码
Jul 20 Javascript
JavaScript数据类型的存储方法详解
Aug 25 Javascript
JS实现页面内跳转的简单代码
Sep 03 Javascript
vue-router路由与页面间导航实例解析
Nov 07 Javascript
vue实现组件之间传值功能示例
Jul 13 Javascript
自己动手封装一个React Native多级联动
Sep 19 Javascript
Vue Render函数原理及代码实例解析
Jul 30 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写入数据库类代码分享
2011/07/26 PHP
php数组函数序列之array_flip() 将数组键名与值对调
2011/11/07 PHP
php中inlcude()性能对比详解
2012/09/16 PHP
destoon二次开发入门示例
2014/06/20 PHP
thinkphp缓存技术详解
2014/12/09 PHP
[原创]PHP获取数组表示的路径方法分析【数组转字符串】
2017/09/01 PHP
FLASH 广告之外的链接
2008/12/16 Javascript
js中的replace方法使用介绍
2013/10/28 Javascript
轻松创建nodejs服务器(3):代码模块化
2014/12/18 NodeJs
js+css实现导航效果实例
2015/02/10 Javascript
javascript中定义类的方法详解
2015/02/10 Javascript
关于javascript中dataset的问题小结
2015/11/16 Javascript
js获取鼠标点击的对象,点击另一个按钮删除该对象的实现代码
2016/05/13 Javascript
jQuery简单实现MD5加密的方法
2017/03/03 Javascript
详解Vue取消eslint语法限制
2018/08/04 Javascript
JS实现的Object数组去重功能示例【数组成员为Object对象】
2019/02/01 Javascript
js的继承方法小结(prototype、call、apply)(推荐)
2019/04/17 Javascript
JavaScript动态检测密码强度原理及实现方法详解
2019/06/11 Javascript
js变量值传到php过程详解 将php解析成数据
2019/06/26 Javascript
angularjs模态框的使用代码实例
2019/12/20 Javascript
让mocha支持ES6模块的方法实现
2020/01/14 Javascript
vue通过接口直接下载java生成好的Excel表格案例
2020/10/26 Javascript
python3实现抓取网页资源的 N 种方法
2017/05/02 Python
Python处理菜单消息操作示例【基于win32ui模块】
2018/05/09 Python
英国最大的独立家具零售商:Furniture Village
2016/09/06 全球购物
美国隐形眼镜网上商店:Lens.com
2019/09/03 全球购物
股份转让协议书
2014/04/12 职场文书
司法建议书范文
2014/05/13 职场文书
教师党员个人整改措施
2014/10/27 职场文书
优秀团队申报材料
2014/12/26 职场文书
大学毕业论文致谢词
2015/05/14 职场文书
四群教育工作总结
2015/08/10 职场文书
2016年最美孝心少年事迹材料
2016/02/26 职场文书
python实现大文本文件分割成多个小文件
2021/04/20 Python
JavaScript严格模式不支持八进制的问题讲解
2021/11/07 Javascript
php实例化对象的实例方法
2021/11/17 PHP