移动端事件：
苹果推出：Touch触摸事件

微软推出：Pointer指针事件（统一鼠标、触摸、笔）

常量名前加$表示这个常量是获取的DOM元素；

Touch事件：

Touch事件类型：

touchstart | touchmove | touchend | touchcancel(touchcancel事件是在在touchend之前发生其他意外事件，如电话进来，弹出其他层等，就会触发touchcancel,不触发touchend)

注意事项：

1.Touch事件在PC端不会触发，鼠标事件在PC端和移动端都会触发；

2.即使触摸点移出目标元素，touchmove事件依然会持续触发，而mousemove事件不会再触发；

3.Touch事件的特征检测（判断浏览器是否支持Touch事件）：

使用in关键字，可以检测元素是否可以访问某个属性，如：console.log('ontouchstart' in window),结果是一个布尔值。

Touch事件event事件对象

1.event对象的常用属性

type属性：返回触发事件的类型，如touchstart等；

target属性：返回绑定事件的DOM元素，即目标元素；

touches属性：返回一个数组，屏幕上所有触摸点；

targetTouches属性：返回一个数组，起始于目标上的所有触摸点；

changedTouches属性：事件触发时，状态发生了改变的所有触摸点

2.触摸点的常用属性

获取触摸点：触摸点是event对象的属性的元素，即：

const touch = evt.changedTouches[0];

identifier属性：是触摸点的唯一标识符，返回的是一个整数；

target属性：返回目标元素；

screenX | screenY属性：返回触摸点相对屏幕的x | y坐标;（少用）

clientX | clientY属性：返回触摸点相对于可视区的x | y坐标；

pageX | pageY属性：返回触摸点相对于页面的x | y坐标；

3.阻止浏览器的默认行为

默认行为：如scrolling(滚动)、pinch/zoom(用手指缩放)，鼠标事件等默认行为；

阻止默认行为的方法：

可以在touch的事件处理函数中使用evt.preventDefault()阻止浏览器的默认行为;

可以在需处理的DOM的css中写touch-action属性，告诉浏览器哪些触摸操作让浏览器处理，阻止其他触摸操作的默认行为。属性值具体参考网址：touch-action - CSS（层叠样式表） | MDN

Pointer事件

1.Pointer事件的类型

pointerover/pointerenter/pinterout/pointerleave/pointerdown/pointermove/pointerup/pointercancel

2.注意事项：

2.1：Pointer事件直接继承了鼠标事件，在此基础上又添加了其他一些内容，处理Pointer事件和处理鼠标事件几乎一致；

2.2：Pointer事件在PC端和移动端都会触发；

2.3：触摸点移出目标元素，touchmove事件依然会持续触发，pointermove和mousemove事件不会再触发；

3.Pointer事件的特征检测（判断浏览器支不支持Pointer事件）

if('onpointerdown' in window){console.log('支持Pointer事件')}；

4.Pointer事件的event对象

4.1.Pointer事件的event对象的常用属性

pointerId属性：指针id，返回一个整数，是触发点的唯一标识符；

type属性：返回的是触发的事件具体类型，如pointerout;

pointerType属性：指针类型，返回的是触发事件的类型（鼠标、笔、触摸）;

target属性：返回目标元素；

screenX | screenY属性：指针相对于可视区的坐标，别名x | y;

pageX | pageY 属性：指针相对于HTML文档页面的坐标；

5.阻止浏览器的默认行为

5.1：阻止scrolling,pinch/zoom,鼠标事件等默认行为

Pointer的事件处理函数中,evt.preventDefault()阻止的是PC端的默认行为（不能阻止scrolling,pinch/zoom,鼠标事件等默认行为，可以阻止图片拖动的默认行为）；

5.2 ：可以在touch的时间处理函数中使用evt.preventDefault()阻止移动端的默认行为；

5.3：touch-action 设置触摸操作时浏览器的默认行为；