事件类型
touchstart: 手指触摸屏幕时触发
touchmove: 手指在屏幕上移动时触发
touchend: 手指离开屏幕时触发
TouchEvent对象
touches: 位于屏幕上的所有手指的列表
targetTouches: 位于该元素上的所有手指的列表
changedTouches：touchstart时包含刚与触摸屏接触的触点，touchend时包含离开触摸屏的触点
注：没有对比出touches同targetTouches的差异，推荐使用targetTouches
Touch对象
clientX/Y 手指相对于layout viewport的水平/垂直像素距离
pageX/Y 手指相对于layout viewport的水平/垂直像素距离（含滚动）
screenX/Y 手指相对于layout viewport的水平/垂直像素距离（含滚动）
（未设置viewport时，screenX/Y在Webview中不正确）
target 手指最初与屏幕接触时的元素
移动开发通常会设置<meta name="viewport" content="width=device-width, initial-scale=1">，这时这三对坐标值是完全一样的。
click延时
早期移动设备浏览器网页时内容非常小，为了增强用户体验，苹果公司专门为移动设备设计了双击放大的功能，确保用户可以非常方便的放大网页内容，但是当用户单击一个按钮时，移动设备会延时（约300ms）执行，判断用单是否要双击。用触屏事件可以解决这个问题
手势封装
1、tap检测接触和离开屏幕的距离来实现
2、drag跟踪手指移动位置，进而设置元素定位坐标
3、swipe 判断手指滑动的方向
zepto.js
zeptojs为我们封装了常的触屏事件，需要touch模块支持，默认没有构建此模，我们可以自定义构建。
1、安装Nodejs环境
2、下载zepto.js
3、解压缩
4、cmd命令行进入解压缩后的目录
5、执行npm install 命令
6、编辑make文件，添加自定义模块并保存，如下图
7、然后执行命令 npm run-script dist
8、查看目录dist即构建好的zepto.js