跳到主要内容

Zepto.js

Zepto 是一个轻量级的、针对现代高级浏览器的 JavaScript 工具库,它兼容 jQuery 的 API如果你会用 jQuery,那么你就已经会用 Zepto 了。

Zepto 的设计目的是提供与 jQuery 兼容的 API,但并不是 100% 覆盖 jQuery API 。 Zepto 设计的目的是提供一个 5-10k 的通用库、下载并快速执行有一套大家熟悉且稳定的 API, 所以你能把你可以把主要的精力放到应用开发上

Zepto 是一款开源软件,它采用的是对开发者和商业都很友好的开源协议 -- MIT license

下载 Zepto

其他下载方式:

默认构建包含以下模块: Core, Ajax, Event, Form, IE.

如果 $ 变量尚未定义,Zepto 只设置全局变量 $ 指向它本身。 没有 Zepto.noConflict方法。

对浏览器支持:

主要浏览器 (100% 支持)

  • Safari 6+ (Mac)
  • Chrome 30+ (Windows, Mac, Android, iOS, Linux, Chrome OS)
  • Firefox 24+ (Windows, Mac, Android, Linux, Firefox OS)
  • iOS 5+ Safari
  • Android 2.3+ Browser
  • Internet Explorer 10+ (Windows, Windows Phone)

次要浏览器 (全部或部分支持)

  • iOS 3+ Safari
  • Chrome <30
  • Firefox 4+
  • Safari <6
  • Android Browser 2.2
  • Opera 10+
  • webOS 1.4.5+ Browser
  • BlackBerry Tablet OS 1.0.7+ Browser
  • Amazon Silk 1.0+
  • Other WebKit-based browsers/runtimes

需要注意的是 Zepto 的一些可选功能是专门针对移动端浏览器的; 因为它的最初目标在移动端提供一个精简的类似 jQuery 的工具库。

在浏览器上(Safari、Chrome 和 Firefox)上开发页面应用或者构建基于 HTML 的 web-view 本地应用, 例如 PhoneGap,使用 Zepto 是一个不错的选择。

总之,Zepto 希望在所有的现代浏览器中作为一种基础环境来使用。 Zepto 不支持旧版本的 Internet Explorer浏览器(<10)。

手动构建 Zepto

上面提供的 zepto.jszepto.min.js 可以直接使用。 然而,为了更好的程序效果和自由性,可以通过 Zepto 源码构建 Zepto.js 和 zepto.min.js 的时候选择模块并作测试, 使用 UglifyJS 根据你的需要来生 成 zepto.min.js (当服务端开启gzipped后,最精简的代码)文件。

请参考 the README 文件了解如何构建 Zepto, 还有如何测试以及提交补丁的说明。

Zepto 模块

模块名 默认内置 描述
zepto Core module; contains most methods
event Event handling via on() & off()
ajax XMLHttpRequest and JSONP functionality
form Serialize & submit web forms
ie Add support for Internet Explorer 10+ on desktop and Windows Phone 8.
detect Provides $.os and $.browser information
fx The animate() method
fx_methods Animated show, hide, toggle, and fade*() methods.
assets Experimental support for cleaning up iOS memory after removing image elements from the DOM.
data A full-blown data() method, capable of storing arbitrary objects in memory.
deferred Provides $.Deferred promises API. Depends on the "callbacks" module.
When included, $.ajax() supports a promise interface for chaining callbacks.
callbacks Provides $.Callbacks for use in "deferred" module.
selector Experimental jQuery CSS extensions support for functionality such as $('div:first') and el.is(':visible').
touch Fires tap– and swipe–related events on touch devices. This works with both `touch` (iOS, Android) and `pointer` events (Windows Phone).
gesture Fires pinch gesture events on touch devices
stack Provides andSelf & end() chaining methods
ios3 String.prototype.trim and Array.prototype.reduce methods (if they are missing) for compatibility with iOS 3.x.

创建插件

Plugins can be written by adding methods as properties of $.fn:

{% highlight js %} ;(function($){ $.extend($.fn, { foo: function(){ // this refers to the current Zepto collection. // When possible, return the Zepto collection to allow chaining. return this.html('bar') } }) })(Zepto) {% endhighlight %}

To get started with plug-in development, take a look at the source of Zepto's core module, and be sure to read the coding style guidelines.