為什么選擇Zepto.js的原因:
- zepto.js的語法借鑒並且兼容jQuery,會使用jquery就會使用Zepto.js。Zepto.js是移動端的js庫。Zepto.js相當於PC端的jQuery,它提供了很多方法和功能,能夠很快的實現各種需求和功能。使用Zepto.js開發,性能上是最好的,而兼容性比較好,跟jQuery有同樣的API,只是需要自己設計UI
- 壓縮后的 zepto.min.js 大小只有24K。
- 綁定事件不同
- 用 “on”來代替“bind”、“delegate”、”live”。
- 用 “off”來代替“unbind”、“undelegate”、”die”。
- 用 “ $.ajax”來代替“$.ajaxJSONP”。
- 用 “tap”來代替 ”click“,因為click會有200-300ms的延遲。
Zepto.js對 CSS 選擇器的支持
1、Zepto.js沒有 .innerHeight() .outerWidth() 等四個方法。
2、支持基本選擇器
ID選擇器:$("#foo")
class選擇器:$(".foo")
標簽(元素)選擇器:$("div")、$("p")。
通用選擇器:$("*")。
3、支持層級選擇器
后代選擇器:$("foo bar")。
子元素選擇器:$("foo > bar")。
相鄰且靠后選擇器:$("foo + bar")。
同輩且靠后選擇器:$("foo ~ bar")。
4、不支持的選擇器
基本偽類:
first、:not(selector) 、:even 、:odd 、:eq(index) 、:gt(index) 、:lang1.9+ 、:last 、:lt(index) 、:header、:animated 、:focus1.6+ 、:root1.9+ 、:target1.9+
內容偽類::contains(text) 、:empty、 :has(selector)、 :parent 。
可見性偽類::hidden 、:visible 。
屬性選擇器:[attribute!=value]。
表單偽類::input、 :text、 :password、 :radio、 :checkbox、 :submit、 :image、 :reset、 :button、 :file、 :hidden 。
表單對象屬性::selected。
Touch 事件
tap —元素tap的時候觸發。
singleTap and doubleTap — 這一對事件可以用來檢測元素上的單擊和雙擊。(如果你不需要檢測單擊、雙擊,使用 tap 代替)。
longTap — 當一個元素被按住超過750ms觸發。
swipe, swipeLeft, swipeRight, swipeUp, swipeDown — 當元素被划過時觸發。(可選擇給定的方向)