前言：web开发过程遇到触屏适配，需要使用到touch相关一系列事件，以下是开发过程查询的资料总结，以及遇到问题和解决方案
Touch 事件类型
touchstart 手指触摸时事件触发
addEventListener("touchstart", (event) => {});
ontouchstart = (event) => {};
touchmove 手指在屏幕上滑动式触发
addEventListener("touchmove", (event) => {});
ontouchmove = (event) => {};
touchend 手指离开屏幕时触发
touchcancel 系统取消touch事件的时候触发 注释：touchcancel 事件仅适用于带有触摸屏的设备。
每个触摸事件被触发后，会生成一个event对象，event对象里额外包括以下三个触摸列表:
TouchEvent事件
touches:当前位于屏幕下的手指列表信息targetTouches: 当前位于当前元素下的手指列表信息changedTouches: 当前涉及到当前事件的手指列表
通过一个例子来区分一下触摸事件中的这三个属性：
1、用一个手指接触屏幕，触发事件，此时这三个属性有相同的值。
2、用第二个手指接触屏幕，此时，touches有两个元素，每个手指触摸点为一个值。
3、当两个手指触摸相同元素时，targetTouches和touches的值相同，否则targetTouches 只有一个值。changedTouches此时只有一个值，为第二个手指的触摸点，因为第二个手指是引发事件的原因
4、用两个手指同时接触屏幕，此时changedTouches有两个值，每一个手指的触摸点都有一个值
5、手指滑动时，三个值都会发生变化
6、一个手指离开屏幕，touches和targetTouches中对应的元素会同时移除，而changedTouches仍然会存在元素。
7、手指都离开屏幕之后，touches和targetTouches中将不会再有值，changedTouches还会有一个值，此值为最后一个离开屏幕的手指的接触点。
Touch 对象属性
clientX: 触摸目标在视口中的X坐标,不包括任何滚动偏移。
clientY: 触摸目标在视口中的Y坐标,不包括任何滚动偏移。
screenX: 触点相对于屏幕左边缘的 X 坐标。
screenY: 触点相对于屏幕上边缘的 Y 坐标。
pageX: 触点相对于 HTML 文档左边沿的的 X 坐标. 当存在水平滚动的偏移时, 这个值包含了水平滚动的偏移. 只读属性.
pageY: 触点相对于 HTML 文档上边沿的的 Y 坐标. 当存在水平滚动的偏移时, 这个值包含了垂直滚动的偏移. 只读属性.
identifier：表示触摸的唯一标识符
target: 返回触摸点最初接触的 Element，即使这个触摸点已经移出那个元素的交互区域。需要注意的是，如果这个元素在触摸过程中被移除，这个事件仍然会指向它，因此这个事件也不会冒泡到 window 或 document 对象。因此，如果有元素在触摸过程中可能被移除，最佳实践是将触摸事件的监听器绑定到这个元素本身，防止元素被移除后，无法再从它的上一级元素上侦测到从该元素冒泡的事件。
触点坐标选取
touchstart和touchmove使用:
e.targetTouches[0].pageX
touchend使用:
e.changedTouches[0].pageX
如何实时获取touchmove移动下的最新元素 ？
使用 elementFromPoint() + targetTouches
//注： e 为touchmove监听事件的event
const touch=e.targetTouches[0];
// const touch = e.touches[0]; //touches 也可以
const ele = document.elementFromPoint(touch.pageX, touch.pageY);
console.log(ele);
如何获取touchend移动下的最新元素 ？
使用 changedTouches + elementFromPoint()
const handleTouchEnd = (e: TouchEvent) => {
const touch = e.changedTouches[0];
const ele = document.elementFromPoint(touch?.pageX, touch?.pageY);
console.log(ele);
}
touchstart 可以获取触摸开始的元素及坐标：e.target就是触摸开始的元素
资料参考: https://juejin.cn/post/7032959889228070925 touch 对象详解 touchEvent 详解