zepto.js常用操作
zepto.js是移动端的jquery,但是并没有提供所有与jquery类似的api。Zepto设计的目的是有一个5-10k的通用库、下载并快速执行、有一个熟悉通用的API,所以你能把你主要的精力放到应用开发上。而jquey中涵盖了很多比如兼容IE浏览器的代码,这在移动端上完全是没有必要的,所以zepto做了一些精简并提供了移动端相关touch事件。
zepto.js静态文件 http://zeptojs.com/zepto.js
我们可以看到zepto的大小如下:

这在移动端来说几乎是没有限制的,因为9.6k的文件相对于jquery还是非常可观的。
zepto的浏览器支持如下所示:
可以看到移动端安卓手机是在2.2到2.3以上,这对于我们的兼容性要求应该是足够了(一般现在安卓手机兼容到4.0版本以上就可以了,2.2和2.3的安卓手机现在已经很少了,在2011年就发布了3.0版本,现在这些手机大多应该是淘汰了,比如我是用的红米note4的安卓系统版本已经达到了6.0), 而对于ios系统而言,兼容到ios5就足够了,因为我们可以看大iphone4的版本是4,iphone4s的版本是5,现在用户使用的最低也应该是iphone4s了,所以兼容到ios5已经足够。
附: ios设备列表
基本使用
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>zepto</title>
<script src="./zepto.js"></script>
</head>
<body>
<!-- your code... -->
</body>
</html>
和jquery的使用是一样的,首先引入zepto.js然后就可以使用了。
创建插件
什么是插件? 插件就是对原有的库的扩展,比如这里介绍的对zepto的扩展, 即使用zepto编写的实现特定功能的js代码。 又如我们使用jquery可能希望实现下拉框等常用的操作,那么我们就可以在引入jquery的情况下,引入插件。
为什么要使用插件? 因为对于轮播图、炫酷的下拉菜单、弹出框等,自己写起来会比较麻烦,而别人又已经写好了这些插件,那么我们直接使用即可,这有助于提高我们开发的效率。
如何自己开发插件? 对,这里就是我们将要学习的地方了,创建了自己的插件之后,我们就可以直接在引入zepto的情况下引入插件即可实现效果。
由于它和jquery创建插件的方式是一样的,所以可以看我的这篇文章《创建jquery插件》。
核心方法
http://www.css88.com/doc/zeptojs_api/
本文参考文档:http://www.css88.com/doc/zeptojs_api/
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>zepto</title> <script src="./zepto.js"></script></head><body> <!-- your code... --></body></html>
zepto.js常用操作的更多相关文章
- JS常用操作节点的方法
js常见的创建dom节点的方法有 createElement() 创建一个元素节点 => 接收参数为string类型的nodename createTextNode() 创建一个文本节点 =&g ...
- js常用操作代码
页面前进后退<input type=button value=刷新 onclick="window.location.reload()"><input type= ...
- js常用操作
map操作:var map = {};map["a"] = 1;map["b"] = 2; console.log(Object.keys(map)); //[ ...
- 【JS 常用操作】
正则表达式 <script> var str = "(08:30-10:00)"; var patt = /^[(][0-9]{2}:[0-9]{2}-[0-9]{2} ...
- js常用操作事件
触发描述 方法 用法 点击 onclick="method();" 变换 onchange="testChange();" 双击 ondblclick= ...
- js常用操作~~~~将持续更新
1.替换多个模板变量 var s="my javascript is very poor,who can help me?" var reg=/(\w*)my(.*)is(.*)c ...
- js 常用操作 -- 持续更新
替换数组中某一元素: array.splice(2, 1, '哈哈'); // 2 表示指定数组中2下标元素,1表示要删除的项数,哈哈 是替换后的值 在数组中某元素之前增加元素: array.spli ...
- 【JS 常用操作】全选、给后来元素增加事件
11 //全选 $("#allCheckbox").click(function () { var checkedStatus = this.checked; //alert(ch ...
- javascript中字符串常用操作总结、JS字符串操作大全
字符串的操作在js中非常频繁,也非常重要.以往看完书之后都能记得非常清楚,但稍微隔一段时间不用,便会忘得差不多,记性不好是硬伤啊...今天就对字符串的一些常用操作做个整理,一者加深印象,二者方便今后温 ...
随机推荐
- 《Effective Java》第8章 通用程序设计
第47条:了解和使用类库 Top 100 Java Libraries on Github 2016 Library Number of Projects Type % of projects jun ...
- 《Maven实战》笔记-10-灵活的构建
一.灵活构建的意义 一个优秀的构建系统必须足够灵活,它应该能够让项目在不同的环境下都能成功地构建.例如,典型的项目都会有开发环境.测试环境和产品环境,这些环境的数据库配置不尽相同,那么项目构建的时候就 ...
- Android之九宫格解锁的实现
<ignore_js_op> 下面是最重要的那个LocusPassWordView ...
- 基于jQuery的Tooltip
近来,要开发一个关务管理系统,为了增加系统美观度,自己开发了一个基于jQuery框的的小插件,与大家分享一下,希望大家能给我提出宝贵修改意见. 下面开发说明使用方法和内容: 一.引用jQuery框架, ...
- Xcode编译报错信息总结
1.dyld: Library not loaded: @rpath/.../xxx.framework 一般与这个库的加载路径有关,先看看是否将静态库设置成了动态库(库的Mach-o Type选项) ...
- C#使用Newtonsoft.Json操作json
1.下载 Newtonsoft.Json 右键引用,选择 管理NuGet程序包,选择浏览,输入log4net,然后点击下载 2.json数据的组装与解析 public class Class { pu ...
- spring分布式事务学习笔记(2)
此文已由作者夏昀授权网易云社区发布. 欢迎访问网易云社区,了解更多网易技术产品运营经验. Model类如下:package com.xy.model 1 package com.xy.model; ...
- Liunx在开机后,自动启动openldap、radius、memcached等程序的shell脚本
以下是脚本命令: #!/bin/bash #说明:此文件需放在/etc/rc.d/init.d/目录下,然后编辑文件/etc/rc.d/rc.local,在里面添加bash /etc/init.d/A ...
- CHImage
1.启动图.图标 iOS应用图片尺寸制作脚本 ======= github 规格尺寸(官方) AppIcon应用图标 and Launchimage启动图标的制作 iPhone所有手机型号屏幕尺寸 2 ...
- 基于vue框架项目开发过程中遇到的问题总结(二)
1.mouseup事件丢失 查看了网上资料,造成mouseup事件丢失有两种原因: (1)触发了浏览器的drag事件 (2)由于鼠标离开了操作的区域,触发了mouseleave事件导致mouseup丢 ...