编程 Javascript

Javascript中找到子元素在父元素内相对位置的代码

Posted in Javascript onJuly 21, 2012

经过自己一晚上尝试，貌似找到了一个方法。
现在脑袋还糊涂，先记下来，以后再分析。

// 找到子元素在父元素中的相对位置 
function getElementTop(element){ 
var el = (typeof element == "string") ? document.getElementById(element) : element; 
if (el.parentNode === null || el.style.display == 'none') { 
return false; 
} 
return el.offsetTop - el.parentNode.offsetTop; 
}

这个函数可以获取子元素在父元素中的相对高度，可以通过设置父元素的 scrollTop 的属性来定位到子元素的位置

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

window.open被浏览器拦截后的自定义提示效果代码

Nov 19 Javascript

jquery+json实现数据列表分页示例代码

Nov 15 Javascript

原生javascript模仿win8等待提示圆圈进度条

Apr 24 Javascript

使用Sticky组件实现带sticky效果的tab导航和滚动导航的方法

Mar 22 Javascript

jQuery EasyUI tree 使用拖拽时遇到的错误小结

Oct 10 Javascript

微信小程序教程之WXML

Oct 18 Javascript

通过一个简单的例子学会vuex与模块化

Nov 22 Javascript

Nginx 配置多站点vhost 的方法

Jan 07 Javascript

浅谈Vue路由快照实现思路及其问题

Jun 07 Javascript

学习LayUI时自研的表单参数校验框架案例分析

Jul 29 Javascript

微信小程序仿淘宝热搜词在搜索框中轮播功能

Jan 21 Javascript

JS eval代码快速解密实例解析

Apr 23 Javascript

分享XmlHttpRequest调用Webservice的一点心得

Jul 20 #Javascript

基于jquery的可多选的下拉列表框

Jul 20 #Javascript

基于jquery的DIV随滚动条滚动而滚动的代码

Jul 20 #Javascript

最佳6款用于移动网站开发的jQuery 图片滑块插件小结

Jul 20 #Javascript

基于jquery的图片轮播 tab切换组件

Jul 19 #Javascript

JavaScript面向对象知识串结(读JavaScript高级程序设计(第三版))

Jul 17 #Javascript

JavaScript面向对象(极简主义法minimalist approach)

Jul 17 #Javascript

You might like

php 定义404页面的实现代码

2012/11/19 PHP

zend framework框架中url大小写问题解决方法

2014/08/19 PHP

PHP文件读取功能的应用实例

2015/05/08 PHP

ThinkPHP3.1.x修改成功与失败跳转页面的方法

2017/09/29 PHP

jQuery 1.5最新版本的改进细节分析

2011/01/19 Javascript

用js调用迅雷下载代码的二种方法

2013/04/15 Javascript

iframe子父页面调用js函数示例

2013/11/07 Javascript

JQuery伸缩导航练习示例

2013/11/13 Javascript

Extjs4中Form的使用之本地hiddenfield

2013/11/26 Javascript

JS实现环形进度条（从0到100%）效果

2016/07/05 Javascript

Angular实现购物车计算示例代码

2017/02/21 Javascript

jQuery回调方法使用示例

2017/06/26 jQuery

js实现登录注册框手机号和验证码校验（前端部分）

2017/09/28 Javascript

elementUi vue el-radio 监听选中变化的实例代码

2019/06/28 Javascript

ES6 Object.assign()的用法及其使用

2020/01/18 Javascript

Jquery+javascript实现支付网页数字键盘

2020/12/21 jQuery

python在linux中输出带颜色的文字的方法

2014/06/19 Python

python实现数值积分的Simpson方法实例分析

2015/06/05 Python

Python数据处理numpy.median的实例讲解

2018/04/02 Python

如何在python字符串中输入纯粹的{}

2018/08/22 Python

Python3实现腾讯云OCR识别

2018/11/27 Python

Python提取特定时间段内数据的方法实例

2019/04/01 Python

python如何爬取动态网站

2020/09/09 Python

Python eval函数介绍及用法

2020/11/09 Python

Pandas DataFrame求差集的示例代码

2020/12/13 Python

基于pycharm 项目和项目文件命名规则的介绍

2021/01/15 Python

CSS去掉A标签（链接）虚线框的方法

2014/04/01 HTML / CSS

ONLY德国官方在线商店：购买时尚女装

2017/09/21 全球购物

环境科学专业个人求职的自我评价

2013/11/28 职场文书

幼儿园秋游活动方案

2014/01/21 职场文书

求职信名称怎么写

2014/05/26 职场文书

相亲活动方案

2014/08/26 职场文书

Unity连接MySQL并读取表格数据的实现代码

2021/06/20 MySQL

Vue vee-validate插件的简单使用

2021/06/22 Vue.js

分析MySQL优化 index merge 后引起的死锁

2022/04/19 MySQL

JS前端使用Canvas快速实现手势解锁特效

2022/09/23 Javascript