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 相关文章推荐
Node.js:Windows7下搭建的Node.js服务(来玩玩服务器端的javascript吧,这可不是前端js插件)
Jun 27 Javascript
jquery实现不同大小浏览器使用不同的css样式表的方法
Apr 02 Javascript
node.js中的fs.link方法使用说明
Dec 15 Javascript
js鼠标滑过图片震动特效的方法
Feb 17 Javascript
javascript实现数组中的内容随机输出
Aug 11 Javascript
javascript先序遍历DOM树的方法
Feb 27 Javascript
Jquery实现的简单轮播效果【附实例】
Apr 19 Javascript
Form表单按回车自动提交表单的实现方法
Nov 18 Javascript
Vue2.0利用vue-resource上传文件到七牛的实例代码
Jul 28 Javascript
vue.js整合mint-ui里的轮播图实例代码
Dec 27 Javascript
一步一步的了解webpack4的splitChunk插件(小结)
Sep 17 Javascript
小程序如何自主实现拦截器的示例代码
Nov 04 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
2020年4月新番动漫目录 官方宣布4月播出的作品一览
2020/03/08 日漫
收藏的一个php小偷的核心程序
2007/04/09 PHP
提高PHP性能的编码技巧以及性能优化详细解析
2013/08/24 PHP
md5 16位二进制与32位字符串相互转换示例
2013/12/30 PHP
PHP数组与字符串互相转换实例
2020/05/05 PHP
PHP常用header头定义代码示例汇总
2020/08/29 PHP
IE6弹出“已终止操作”的解决办法
2010/11/27 Javascript
jQuery :first选择器使用介绍
2013/08/09 Javascript
用JS实现3D球状标签云示例代码
2013/12/01 Javascript
extjs 分页使用jsp传递数据示例
2014/07/29 Javascript
javascript实现瀑布流自适应遇到的问题及解决方案
2015/01/28 Javascript
JS关闭窗口时产生的事件及用法示例
2016/08/20 Javascript
Ionic默认的Tabs模板使用实例
2016/08/29 Javascript
Angularjs CURD 详解及实例代码
2016/09/14 Javascript
yarn的使用与升级Node.js的方法详解
2017/06/04 Javascript
VUE 实现element upload上传图片到阿里云
2020/08/12 Javascript
Vue基于localStorage存储信息代码实例
2020/11/16 Javascript
Python性能提升之延迟初始化
2016/12/04 Python
Python如何快速实现分布式任务
2017/07/06 Python
Python文件循环写入行时防止覆盖的解决方法
2018/11/09 Python
python3.7简单的爬虫实例详解
2019/07/08 Python
python不使用for计算两组、多个矩形两两间的iou方式
2020/01/18 Python
python Plotly绘图工具的简单使用
2020/03/03 Python
如何让python的运行速度得到提升
2020/07/08 Python
如何基于python实现年会抽奖工具
2020/10/20 Python
Django框架实现在线考试系统的示例代码
2020/11/30 Python
记帐员岗位责任制
2014/02/08 职场文书
大三学生做职业规划:给未来找个方向
2014/02/24 职场文书
医学院毕业生自荐信范文
2014/03/06 职场文书
投资合作协议书
2014/04/17 职场文书
2019通用版劳动合同范本!
2019/07/11 职场文书
喜迎建国70周年:有关爱国的名言名句
2019/09/24 职场文书
python之django路由和视图案例教程
2021/07/26 Python
使用Python+OpenCV进行卡类型及16位卡号数字的OCR功能
2021/08/30 Python
Java使用Unsafe类的示例详解
2021/09/25 Java/Android
CSS中calc(100%-100px)不加空格不生效
2023/05/07 HTML / CSS