ZeptoJS

ZeptoJS

1、介绍
what？ 是一个轻量级的针对现代浏览器的js库
why？ ①门槛比较低 ②轻量 ③性能优越
when？ 功能简单的移动端的app


不支持ie10以下的浏览器，支持现代浏览器


zeptojs.com
http://github.e-sites.nl/zeptobuilder/




自定义构建的模块：
①到zeptoBuilder网站 ②选中需要的模块 ③generate custom build④save to disk


2、核心模块


①数据操作
map\each\grep\extend\parseJSON\trim\is**


②查找元素
属性、后代、id。。


③插入、删除、改
插入：insertAfter/Before append appendTo prpend prenpendTo
修改：html/css/attr/addClass
删除：remove/removeAttr/removeClass..
查找：兄弟元素




3、 event 事件模块


事件的绑定和解绑：on/off/one/trigger


练习：
新建一个文件，
视图：button，给按钮绑定事件，自增操作，当数据超过10的时候，解除事件的绑定，同时再one方法绑定一个事件，提示‘ in one function’




4、touch模块（结合gesture、detect一起来使用）


需要自己构建js文件，去包含对应的touch模块。


移动端和触控相关的:
tap/longTap/doubleTap
swipe/swipeLeft/swipeRight/swipeUp/swipeDown


如果无法实现检测swipe事件，设置阻止浏览器默认的行为：
document.addEventListener('touchmove',function(event){
event.preventDefault();
},false)


5、detect 获取设备os、browser相关信息


$.os
$.browser


6、Ajax 发起异步请求


$.ajax $.get $.post load


练习：
分别调用$.ajax和$.post发起post请求，参数name='web1609'
demo.php 接收参数，返回 hello Web1609,客户端接收到服务器返回的结果打印出来


启动apache服务，工程放在htdocs目录中。




7、form


serialize 序列化&字符串
serializeArray 序列化成一个对象数组（对象包含name、value）
submit 指定提交时的处理函数






8、fx以及fxmethod(动画模块)
animate/show/hide/fade*