触屏事件

兼容DOM的触屏事件：

触屏touch事件	说明
touchstart	当手指触摸屏幕时触发
touchmove	当手指在屏幕上滑动时连续触发
touchend	当手指从屏幕离开时触发

每个触摸事件包含的三个触摸列表：

触摸列表	说明
touches	当前屏幕上的所有手指动作的列表
targetTouches	当前DOM元素上的手指动作的列表
changeTouches	当前事件的手指动作的列表

targetTouches[0] 就可以得到正在触摸dom元素的第一个手指的相关信息比如 手指的坐标等等

 移动端拖动元素:

touchstart、touchmove、touchend 可以实现拖动元素
但是拖动元素需要当前手指的坐标值 我们可以使用  targetTouches[0] 里面的clientX 和 clientY
移动端拖动的原理:手指移动，计算出手指移动的距离。然后用盒子原来的位置 + 手指移动的距离
手指移动的距离：  手指滑动中的位置 减去  手指刚开始触摸的位置
拖动元素三步曲：

（1） 触摸元素 touchstart： 获取手指初始坐标，同时获得盒子原来的位置

（2） 移动手指 touchmove： 计算手指的滑动距离，并且移动盒子

（3） 离开手指 touchend:

注意： 手指移动也会触发滚动屏幕所以这里要阻止默认的屏幕滚动 e.preventDefault();