HTML4未定义任何触摸事件，因其发布于1999年，早于触控设备普及；HTML5定义了touchstart、touchmove、touchend、touchcancel四个核心触摸事件。
HTML4 完全不支持触摸事件——因为触摸事件是 HTML5 规范中为移动设备交互专门引入的，HTML4 标准发布于 1999 年，远早于智能手机和多点触控屏幕的普及，其事件模型只定义了 click、mousedown 等鼠标事件，没有 touchstart、touchmove 等任何触摸相关接口。
所以不是“HTML4 不支持”，而是它根本没定义、没概念——就像问“自行车有没有 USB-C 接口”一样。
HTML5 的 touch 事件有哪些？核心就这 4 个
现代浏览器（iOS Safari、Android Chrome、Edge、Firefox 移动版等）在触屏设备上支持以下原生触摸事件：
-
touchstart：手指刚接触屏幕时触发（哪怕已有其他手指在屏上，也会触发） -
touchmove：手指在屏幕上滑动过程中连续触发（高频！需注意性能） -
touchend：手指离开屏幕时触发（注意：仅当该手指离开，不等于所有手指都离开了） -
touchcancel：系统主动中断触摸（如来电、弹出系统通知、WebView 被切到后台），不是用户行为，但必须监听并清理状态
⚠️ 注意：touchcancel 容易被忽略，但它会导致 touchend 不触发。如果你在 touchstart 中记录了起始坐标或启动了 setTimeout（比如做长按检测），却没在 touchcancel 里 clearTimeout 或重置状态，就会引发内存泄漏或逻辑错乱。
立即学习“前端免费学习笔记（深入）”；
为什么不能只用 touches[0]？三个 TouchList 的区别必须分清
每个触摸事件对象（event）都带三个关键属性，它们不是冗余，而是解决不同场景问题的：
-
event.touches：当前屏幕上「所有」活跃手指的列表（跨元素）。适合全局手势识别（如双指缩放判断是否两个手指都在屏上） -
event.targetTouches：当前事件目标元素（即你绑定事件的那个 DOM 节点）上「正在接触」的手指列表。拖拽单个元素时应优先用它，避免误响应子元素外的手指 -
event.changedTouches：本次事件中「状态发生改变」的手指（比如刚按下、刚抬起、位置更新）。touchend里只有它包含刚抬走的手指，touchstart里它才是新触达的手指
✅ 正确写法示例（单指拖拽）：
element.addEventListener('touchstart', e => {
// 用 changedTouches 拿「这次新按下的手指」
const touch = e.changedTouches[0];
startX = touch.clientX;
startY = touch.clientY;
});
<p>element.addEventListener('touchmove', e => {
// 防止页面滚动干扰拖拽
if (e.targetTouches.length === 1) {
e.preventDefault(); // 关键！否则 iOS/Android 会默认滚动
}
const touch = e.targetTouches[0]; // 用 targetTouches，确保是本元素上的手指
element.style.transform = <code>translate(${touch.clientX - startX}px, ${touch.clientY - startY}px)</code>;
});</p>兼容 PC 鼠标和移动端触摸的最简方案
很多业务要一套代码跑在桌面和手机上。别写两套事件监听，用能力检测 + 统一抽象即可：
- 先判断是否支持触摸：
'ontouchstart' in window（注意不是document，Safari 旧版有差异） - 若支持，绑定
touchstart/touchmove/touchend；否则绑定mousedown/mousemove/mouseup - 统一从事件中取坐标：
e.touches?.[0] || e，再读clientX/clientY
⚠️ 坑点：PC 上 mousemove 会持续触发，而移动端 touchmove 在手指静止时不会触发——所以做“跟随光标”类交互时，不要依赖“连续触发”来维持状态，要用 requestAnimationFrame 主动刷新。
真正难的不是写对几个事件名，而是理解 targetTouches 和 changedTouches 在多点触控下如何交叉变化，以及 touchcancel 这个“静默破坏者”何时出现——它不报错，但会让你的长按、双击、滑动判定全部失效。
