touchstart 与 click
touchstart : 触摸开始事件，当手指接触屏幕上的一刹那，触发该事件。
click: PC端点击事件，在移动端也可以使用，不过会有200ms延迟，一般不建议使用。
var box = document.getElementById("touchstart"); box.addEventListener("touchstart", function (e) { //e.preventDefault() //阻止鼠标事件触发 console.log('touchstart'); }); box.addEventListener("click", function (e) { console.log('click'); });
看到控制台，touchstart先执行，而click要等一小段时间才执行(肉眼可见)；
如果不想让click触发，阻止默认事件就可：e.preventDefault()
touchmove
手指在某区域持续滑动，会触发该事件
box.addEventListener("touchmove", function (e){ //do something })
使用该事件时切记要做好函数节流，毕竟移动端性能有限，函数防抖与节流详见我上篇文章 函数防抖与节流
touchend
某区域内触摸事件结束的一刹那触发该事件，或称手指抬起的一瞬间。
// touchend触摸结束 box.addEventListener("touchend", function (e){ console.log('touchend事件'); })
touchEvent
TouchEvent是一个对象，在做移动端业务或功能需求的时候，经常会用到。可以试着打印一下，看它里面有些什么
box.addEventListener('touchstart', function(e) { console.dir(e); // 查看TouchEvent对象的属性和方法 });
打印结果
重点讲一下这三个常用的
changedTouches：一个 TouchList 对象，包含了代表所有从上一次触摸事件到此次事件过程中，状态发生了改变的触点的 Touch 对象。做移动端滑动事件会用到。
targetTouches：一个 TouchList 对象，是包含了如下触点的 Touch 对象：触摸起始于当前事件的目标 element 上，并且仍然没有离开触摸平面的触点。
touches：一 个 TouchList 对象，包含了所有当前接触触摸平面的触点的 Touch 对象，无论它们的起始于哪个 element 上，也无论它们状态是否发生了变化。多指操作，获取多个触点会用到
