zepto源码--核心方法6(显示隐藏)--学习笔记
2016-11-17 09:09
387 查看
在不引入zepto插件模块fx_metho其他ds的情况下,zepto默认的显示隐藏的函数只有show, hide, toggle,这里解释有个前提条件,就是没有引入zepto的fx_methods插件模块
show
![](https://images2015.cnblogs.com/blog/1006110/201611/1006110-20161117085223326-980102862.png)
相比较于jQuery的show函数,这里真的很简单了,没有传入任何参数,如果在标签上以内联样式的形式存在style="display:none",直接将该内联样式的none改为空,如果不是内联样式,则通过获取计算后的样式,getComputedStyle(this, '').getPropertyValue("display"),判断其如果等于“none”,则将其的display值设置为该节点的默认样式,defaultDisplay(this.nodeName)。
hide
![](https://images2015.cnblogs.com/blog/1006110/201611/1006110-20161117090504123-1155397468.png)
hide更简单,没什么好说的,直接将该元素的display值设置为none。
toggle
![](https://images2015.cnblogs.com/blog/1006110/201611/1006110-20161117090636513-830638952.png)
对toggle函数的介绍在前面有过单独的介绍,见zepto--toggle函数
show
![](https://images2015.cnblogs.com/blog/1006110/201611/1006110-20161117085223326-980102862.png)
相比较于jQuery的show函数,这里真的很简单了,没有传入任何参数,如果在标签上以内联样式的形式存在style="display:none",直接将该内联样式的none改为空,如果不是内联样式,则通过获取计算后的样式,getComputedStyle(this, '').getPropertyValue("display"),判断其如果等于“none”,则将其的display值设置为该节点的默认样式,defaultDisplay(this.nodeName)。
hide
![](https://images2015.cnblogs.com/blog/1006110/201611/1006110-20161117090504123-1155397468.png)
hide更简单,没什么好说的,直接将该元素的display值设置为none。
toggle
![](https://images2015.cnblogs.com/blog/1006110/201611/1006110-20161117090636513-830638952.png)
对toggle函数的介绍在前面有过单独的介绍,见zepto--toggle函数
相关文章推荐
- zepto源码--核心方法10(位置)--学习笔记
- zepto源码--核心方法3(属性相关)--学习笔记
- zepto源码--核心方法5(文本操作)--学习笔记
- zepto源码--核心方法(类数组相关)--学习笔记
- zepto源码--核心方法4(包装)--学习笔记
- zepto源码--核心方法8(管理包装集)--学习笔记
- zepto源码--核心方法2(class相关)--学习笔记
- zepto源码--核心方法7(管理包装集)--学习笔记
- zepto源码--核心方法9(管理包装集)--学习笔记
- 【zepto学习笔记01】核心方法$()(补)
- 【zepto学习笔记01】核心方法$()(补)
- 【zepto学习笔记01】核心方法$()
- 【zepto学习笔记01】核心方法$()
- 黑马程序员之WinForm编程基础学习笔记:页面上有一张图片,默认是隐藏的,用户在文本框中输入身份证号(131226198105223452),点击按钮,如果年龄大于18岁则显示图片。
- 计算机网络(自顶向下方法)学习笔记 1.3 网络核心
- 【锋利的JQuery-学习笔记】输入框提示语-隐藏/显示
- Zepto源码分析一~核心方法
- 计算机网络(自顶向下方法)学习笔记 1.3 网络核心
- 学习笔记-隐藏键盘的一个方法例子
- Ferris教程学习笔记:js示例2.14 单一按钮显示/隐藏 乐曲播放列表