编程 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 相关文章推荐

JavaScript 事件记录使用说明

Oct 20 Javascript

使用JQuery和CSS模拟超链接的用户单击事件的实现代码

May 23 Javascript

innerHTML与jquery里的html()区别介绍

Oct 12 Javascript

Javascript函数式编程简单介绍

Oct 11 Javascript

js手机号4位显示空格，银行卡每4位显示空格效果

Mar 23 Javascript

用vue封装插件并发布到npm的方法步骤

Oct 18 Javascript

浅谈vue项目可以从哪些方面进行优化

May 05 Javascript

require.js 加载过程与使用方法介绍

Oct 30 Javascript

jQuery时间戳和日期相互转换操作示例

Dec 07 jQuery

一文了解Vue中的nextTick

May 06 Javascript

VUE UPLOAD 通过ACTION返回上传结果操作

Sep 07 Javascript

jenkins自动构建发布vue项目的方法步骤

Jan 04 Vue.js

分享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

几个优化WordPress中JavaScript加载体验的插件介绍

2015/12/17 PHP

PHP设计模式之注册树模式分析

2018/01/26 PHP

php设计模式之观察者模式实例详解【星际争霸游戏案例】

2020/03/30 PHP

Javascript 实用小技巧

2010/04/07 Javascript

网易JS面试题与Javascript词法作用域说明

2010/11/09 Javascript

JavaScript之引用类型介绍

2012/08/10 Javascript

fancybox modal的完美解决(右上的X)

2012/10/30 Javascript

Javascript引用指针使用介绍

2012/11/07 Javascript

js中点击空白区域时文本框与隐藏层的显示与影藏问题

2013/08/26 Javascript

使用ngView配合AngularJS应用实现动画效果的方法

2015/06/19 Javascript

jQuery实现的网页左侧在线客服效果代码

2015/10/23 Javascript

原生js配合cookie制作保存路径的拖拽

2015/12/29 Javascript

JS使用JSON作为参数实例分析

2016/06/23 Javascript

Bootstrap表单布局样式源代码

2016/07/04 Javascript

javascript中异常处理案例(推荐)

2016/10/03 Javascript

JS中闭包的经典用法小结(2则示例)

2016/12/28 Javascript

微信小程序（六）：列表上拉加载下拉刷新示例

2017/01/13 Javascript

Nodejs搭建wss服务器教程

2017/05/24 NodeJs

详解如何用webpack打包一个网站应用项目

2017/07/12 Javascript

javascript将list转换成树状结构的实例

2017/09/08 Javascript

vuejs前后端数据交互之从后端请求数据的实例

2018/08/11 Javascript

在移动端使用vue-router和keep-alive的方法示例

2018/12/02 Javascript

详解Vuex下Store的模块化拆分实践

2019/07/31 Javascript

layui实现显示数据表格、搜索和修改功能示例

2020/06/03 Javascript

Python中set与frozenset方法和区别详解

2016/05/23 Python

Python对列表中的各项进行关联详解

2017/08/15 Python

浅谈Python2获取中文文件名的编码问题

2018/01/09 Python

pandas进行数据的交集与并集方式的数据合并方法

2018/06/27 Python

python爬虫实现中英翻译词典

2019/06/25 Python

jupyter notebook运行命令显示[*](解决办法)

2020/05/18 Python

PyQT5速成教程之Qt Designer介绍与入门

2020/11/02 Python

Annoushka英国官网：英国奢侈珠宝品牌

2018/10/20 全球购物

英国DIY汽车维修配件网站：DIY Car Service Parts

2019/08/30 全球购物

英国领先的独立酒精饮料零售商：DrinkSupermarket

2021/01/13 全球购物

《少年王冕》教学反思

2014/04/11 职场文书

使用Django实现商城验证码模块的方法

2021/06/01 Python