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 相关文章推荐
js中使用DOM复制(克隆)指定节点名数据到新的XML文件中的代码
Jul 27 Javascript
js获取html文件的思路及示例
Sep 17 Javascript
JS+CSS简单树形菜单实现方法
Sep 12 Javascript
JS实现两周内自动登录功能
Mar 23 Javascript
Vue 中对图片地址进行拼接的方法
Sep 03 Javascript
JavaScript命名空间模式实例详解
Jun 20 Javascript
Vue form表单动态添加组件实战案例
Sep 02 Javascript
IE11下CKEditor在Bootstrap Modal中下拉问题的解决
Sep 25 Javascript
JavaScript 自定义html元素鼠标右键菜单功能
Dec 02 Javascript
Javascript Web Worker使用过程解析
Mar 16 Javascript
JavaScript ES 模块的使用
Nov 12 Javascript
vue-video-player 断点续播的实现
Feb 01 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
mysql 性能的检查和优化方法
2009/06/21 PHP
phpmailer简单发送邮件的方法(附phpmailer源码下载)
2016/06/13 PHP
Laravel5.0+框架邮件发送功能实现方法图文与实例详解
2019/04/23 PHP
php实现的表单验证类完整示例
2019/08/13 PHP
FF火狐下获取一个元素同类型的相邻元素实现代码
2012/12/15 Javascript
js固定DIV高度,超出部分自动添加滚动条的简单方法
2013/07/10 Javascript
jquery 取子节点及当前节点属性值
2014/07/25 Javascript
js中confirm实现执行操作前弹出确认框的方法
2014/11/01 Javascript
探寻Javascript执行效率问题
2014/11/12 Javascript
javascript实现瀑布流自适应遇到的问题及解决方案
2015/01/28 Javascript
jQuery实现下滑菜单导航效果代码
2015/08/25 Javascript
JS实现来回出现文字的状态栏特效代码
2015/10/31 Javascript
用jQuery获取table中行id和td值的实现代码
2016/05/19 Javascript
全面解析JavaScript中apply和call以及bind(推荐)
2016/06/15 Javascript
JS限制条件补全问题实例分析
2016/12/16 Javascript
JavaScript数组去重的6个方法
2017/01/21 Javascript
ES6新特性之数组、Math和扩展操作符用法示例
2017/04/01 Javascript
nuxt+axios解决前后端分离SSR的示例代码
2017/10/24 Javascript
vue实现在表格里,取每行的id的方法
2018/03/09 Javascript
详解node.js的http模块实例演示
2018/07/12 Javascript
Vue基于vuex、axios拦截器实现loading效果及axios的安装配置
2019/04/26 Javascript
[04:10]DOTA2英雄梦之声_第11期_圣堂刺客
2014/06/21 DOTA
Python语言生成水仙花数代码示例
2017/12/18 Python
python二维码操作:对QRCode和MyQR入门详解
2019/06/24 Python
Python实现报警信息实时发送至邮箱功能(实例代码)
2019/11/11 Python
Python实现Canny及Hough算法代码实例解析
2020/08/06 Python
运行Python编写的程序方法实例
2020/10/21 Python
html5实现完美兼容各大浏览器的播放器
2014/12/26 HTML / CSS
Linux文件系统类型
2012/02/15 面试题
String s = new String(“xyz”);创建了几个String Object?
2015/08/05 面试题
报关简历自我评价怎么写
2013/09/19 职场文书
2014年清明节寄语
2014/04/03 职场文书
公安机关起诉意见书
2015/05/20 职场文书
喋血孤城观后感
2015/06/08 职场文书
《成长的天空》读后感3篇
2019/12/06 职场文书
MySQL 原理优化之Group By的优化技巧
2022/08/14 MySQL