资讯专栏INFORMATION COLUMN

原生Js判断元素是否隐藏

huaixiaoz / 2133人阅读

摘要:刚刚在看的源码,所以此问题延伸自中的一行代码经过自己实践确实可以使用这种方法来判断当前元素是否被隐藏,包括通过设置父元素为以及自己本身为的情况。但是如果是通过设置则无法检测出。

刚刚在看echo.js的源码,所以此问题延伸自echo.js中的一行代码

var isHidden = function(element) {
    return (element.offsetParent === null);
};

经过自己实践确实可以使用这种方法来判断当前元素是否被隐藏,包括通过设置父元素为display:none以及自己本身为none的情况。但是如果是通过设置visibility:hidden则无法检测出。

overflow关于这个问题的讨论

http://stackoverflow.com/ques...

除了上面的方法还有这种

function isHidden(el) {
    var style = window.getComputedStyle(el);
    return (style.display === "none")
}

这种方式也是需要手动判断visibility。不过貌似offsetParent的方法十分缓慢,即使是新的chrome也无法优化。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/91713.html

相关文章

  • 原生js练习题---第五课

    摘要:那该如何是好原题给出思路是让事件负责标记按键就好了,而方向键的事件处理使用设个周期比较小的定时器持续监听,由于周期小,长按时就会立刻执行相应的事件处理,效果更加流畅。闪烁实现效果闪烁简单的一个定时器应用,用或都可以实现。 0x1模拟select控件 实现效果:5-01模拟select控件 比较简单的点击事件处理,也就处理点击选择框展示菜单、点击菜单选择、点击页面任意角落隐藏菜单这三件事...

    winterdawn 评论0 收藏0
  • 前端常用代码片段(五)

    摘要:当运行时,如果不为,则将超时函数推送到事件队列,并且函数退出,从而使调用堆栈清零。因此,该方法从头到尾不经过直接递归调用即可处理,因此调用堆栈保持清晰,无论迭代次数如何。 前端常用代码片段(一) 点这里前端常用代码片段(二) 点这里前端常用代码片段(三) 点这里前端常用代码片段(四) 点这里 1.tap事件点透问题? 问题点击穿透问题:点击蒙层(mask)上的关闭按钮,蒙层消失后发现触...

    MoAir 评论0 收藏0
  • FastClick 源码解读

    摘要:所有浏览器浏览器不支持安卓中中有属性安卓中中有属性有属性的有属性的所以在不需要的浏览器会直接掉,不会执行下面的所有代码。见源码行,可以看出在响应无操作后,则触发。 其实一直就想花些时间读一读那些优秀的开源库,今天终于下了决定打算死磕下自己,2016年每个月读2-3个优秀的开源库,把源码精彩的地方和自己心得分享给大家。 目录 (一)背景(二)源码解析(三)Zepto 点击穿透与 Fast...

    Chaz 评论0 收藏0
  • 总结移动开发实践中遇到的坑

    摘要:博主之前已经推荐了一款神器下面,就总结一下移动端遇见的坑。解决原理虚拟键盘弹出时将元素设置为,虚拟键盘消失时候设置回来。解决方案由于虚拟键盘出现并未抛出事件,而检测或者事件,皆会有一定延迟,会出现闪烁现象。 做过很多移动端的项目,在开发调试过程中,一款好的调试工具会让效率大大提高。博主之前已经推荐了一款神器:http://web.jobbole.com/87587/ 下面,就总结一下移...

    rockswang 评论0 收藏0
  • 如何判断元素是否在可视区域ViewPort

    摘要:在这里一次性做个总结,以用来判断元素是否在可视区域以及用原生简单实现懒加载。被隐藏在内容区域左侧的像素数。比如上篇文章文字跑马灯项目中的使用戳此跳转小结只读属性,不包括滚动条。 个性签名: 生如夏花,逝如冬雪;人生如此,何悔何怨。 前言: 经常需要计算元素的大小或者所在页面的位置,offsetWidth,clientWidth,scrollWidth,scrollTop这几个关键字的出...

    jayzou 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<