zepto快速入门教程
* zepto
* 特点:
1、体积8kb
2、针对移动端的框架
3、语法同jquery大部分一样,都是$为核心函数
4、目前功能完善的框架体积最小的左右
* 同jquery相似的语法
核心:$
--作为函数使用
参数:
1、function(){}
2、选择器字符串
3、html标签字符串
3、DOM code
--作为对象使用
方法;
1、$.each()
2、$.trim()
3、$.ajax() $.get() $.post()
4、$.isArray()
jquery对象/zepto对象
概念:$调用返回的就是 jquery对象/zepto对象 伪数组(有时候只有一个元素)
* zepto同jquery不同的API
* attr同prop
jquery:标签的固有属性,布尔值属性<prop>
标签的自定义属性,用attr布尔值属性并且布尔值属性在标签体内没有定义时候<attr>
zepto:attr同样获取布尔值属性。
* DOM操作
配置对象:
jquery不同使用配置对象添加id,class。。。
zepto可以使用配置对象---结构,样式分离,而且容易管理
* offset()----用来获取目标元素相对于视口的偏移量 对象
jquery:top , left
zeptop:top,left,width,height(content,补白,border)
* width(),height()
jquery:
1、width(),height() 获取content内容区的值,没有单位
2、.css 获取content内容区的值,有单位px
3、 innerHeight() content,padding没有单位
innerHeight() content,padding border没有单位
zepto:
1、width(),height()获取的content,补白,border
2、没有innerHeight(),innerHeight()
3、.css()
* 事件委托
原理:利用冒泡的原理将事件绑定到父元素/祖先元素身上,event.target指向的子元素
zepto:
1、委托同一个父元素身上
2、同一个世界
3、操作关联,操作对应的元素/类
4、顺序
5、谁操作的关联类就是谁触发的
* each
jquery:能遍历数组,对象,不能遍历字符串/json对象/json数组
zepto:能遍历数组,对象,字符串
* 隐藏元素的宽高
jquery:能获取
zepto: 不能宽,高
zepto的touch event
* tap点击事件
* singleTap()点击事件
* doubleTap()双击事件
* longTap()长按事件--连续作用750ms
* 滑动事件(浏览器的默认行为---翻页---touch-action)
1、swipe滑动事件 在同一个方向连续滑动30px才为滑动,否则就是点击
2、longTap长按事件 手指在目标对象上连续作用超过750ms算长按,否则算点击
zepto快速入门教程的更多相关文章
- 专为设计师而写的GitHub快速入门教程
专为设计师而写的GitHub快速入门教程 来源: 伯乐在线 作者:Kevin Li 原文出处: Kevin Li 在互联网行业工作的想必都多多少少听说过GitHub的大名,除了是最大的开源项目 ...
- EntityFramework6 快速入门教程
EntityFramework6 快速入门教程 不得不说EF在国内实在是太小众,相关的技术文章真实屈指可数,而且很多文章都很旧了,里面使用的版本跟如今的EF6差别还是比较大.我刚开始弄这个的时候真是绕 ...
- Apple Watch开发快速入门教程
Apple Watch开发快速入门教程 试读下载地址:http://pan.baidu.com/s/1eQ8JdR0 介绍:苹果为Watch提供全新的开发框架WatchKit.本教程是国内第一本A ...
- 指示灯组与3个复位按钮的介绍Arduino Yun快速入门教程
指示灯组与3个复位按钮的介绍Arduino Yun快速入门教程 1.4.2 指示灯组 指示灯组的放大图如图1.5所示. 图1.5 指示灯组 各个指示灯对应的功能如下: q RX:对应于0号端口, ...
- 游戏控制杆OUYA游戏开发快速入门教程
游戏控制杆OUYA游戏开发快速入门教程 1.2.2 游戏控制杆 游戏控制杆各个角度的视图,如图1-4所示,它的硬件规格是本文选自OUYA游戏开发快速入门教程大学霸: 图1-4 游戏控制杆各个角度的 ...
- Query 快速入门教程
Query 快速入门教程 http://www.365mini.com/page/jquery-quickstart.htm#what_is_jquery jquery常用方法及使用示例汇总 http ...
- Realm for Android快速入门教程
介绍 如果你关注安卓开发的最新趋势,你可能已经听说过Realm.Realm是一个可以替代SQLite以及ORMlibraries的轻量级数据库. 相比SQLite,Realm更快并且具有很多现代数据库 ...
- CMake快速入门教程-实战
http://www.ibm.com/developerworks/cn/linux/l-cn-cmake/ http://blog.csdn.net/dbzhang800/article/detai ...
- .NET Core 快速入门教程
.NET Core 快速学习.入门系列教程.这个入门系列教程主要跟大家聊聊.NET Core的前世今生,以及Windows.Linux(CentOS.Ubuntu)基础开发环境的搭建.第一个.NET ...
随机推荐
- centos下配置LNMP环境(源码安装)
准备工作,安装依赖库 yum -y install gcc automake autoconf libtool make gcc-c++ glibc libxslt-devel libjpeg lib ...
- B站弹幕系统架构——GOIM解读
架构图 说明: 1.logic启动http服务器, 接受http请求,用于将数据推送到kafka以及获取在线用户信息,websocket身份校验 2.comet组件起动webdocket/tcp服务, ...
- 《Docker从入门到跑路》之多阶段构建
多阶段构建就是在一个Dokcerfile中定义多个FROM,每个FROM都可以使用不同的基础镜像,并表示开始一个新的构建阶段,我们可以很方便的将一个阶段的文件复制到另外一个阶段中,在最终的阶段保存你需 ...
- 使用Codemirror打造Markdown编辑器
前几天突然想给自己的在线编译器加一个Markdown编辑功能,于是花了两三天敲敲打打初步实现了这个功能. 一个Markdown编辑器需要有如下常用功能: 粗体 斜体 中划线 标题 链接 图片 引用 代 ...
- Spring Cloud Alibaba系列(一)nacos作为服务注册中心
Spring Cloud Alibaba各组件版本关系 Spring Cloud Alibaba Version Sentinel Version Nacos Version RocketMQ Ver ...
- STM32学习笔记——GPIO
单片机型号STM32F407VET6. 概述 GPIO的分类: 可接受5V输入的(FT),绝大多数引脚都是: 只能接受3.3V输入的(TTa),只有PA4和PA5,就是DAC输出的两个引脚: 其他,包 ...
- JavaScript 的核心机制——event loop(最易懂版)
前言 javascript从诞生之日起就是一门单线程的非阻塞的脚本语言. 非阻塞就是当代码需要进行一项异步任务(无法立刻返回结果,需要花一定时间才能返回的任务,如ajax事件)时,主线程会挂起(pen ...
- 画结构图的神器 Graphviz
经常看到别人的论文里各种优美的图,没想过它们是怎么来的,前两天也是在看论文的时候被推荐了一款画图软件graphviz,稍微了解了一下这个画图软件,据说是贝尔实验室的几位牛人开发出来的,试了一下觉得很不 ...
- transform-translate3d
translate3d 开启硬件加速,做动效效率比 position 定位置后,改变位置,效果好,比如下拉背景放大效果,上滑的时候背景跟着上滑,可以用 translate3d.亲测效果更好,记下来
- Hadoop2.8.1完全分布式环境搭建
前言 本文搭建了一个由三节点(master.slave1.slave2)构成的Hadoop完全分布式集群(区别单节点伪分布式集群),并通过Hadoop分布式计算的一个示例测试集群的正确性. 本文集群三 ...