touchstart替代click是跨平台一致的前提，因iOS Safari对click有300ms延迟，且JS插件依赖点击触发；需优先用插件自身触摸事件配置，手动接管时用touchstart+preventDefault，并避免click与touchstart共存。
为什么 touchstart 替代 click 是跨平台一致的前提
平板（尤其 iOS Safari）对 click 事件有约 300ms 延迟，且部分 JS 插件（如轮播、下拉菜单）依赖点击触发，不处理会导致响应卡顿、手势失效。这不是插件 bug，而是浏览器默认行为。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 检查插件是否暴露事件绑定入口（如
events: { click: 'tap' }），优先用插件自身支持的触摸事件配置 - 若需手动接管，用
addEventListener('touchstart', handler, { passive: false })，并立即调用event.preventDefault()阻止默认滚动冲突 - 避免同时绑定
click和touchstart—— iOS 下会触发两次，导致重复执行 - Android Chrome 一般兼容
click，但为统一逻辑，仍建议全量切换至touchstart或使用pointerdown
JS 插件初始化时机不对，平板上 DOM 就“没生效”
很多插件（如 Swiper、Flatpickr）依赖元素尺寸或可视区域计算。平板页面常因缩放、横竖屏切换、viewport 设置不准，导致初始化时 offsetWidth 为 0 或布局未就绪。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 不用
DOMContentLoaded直接初始化，改用window.addEventListener('load', initPlugin)确保图片、字体加载完成 - 对响应式插件，监听
resize和orientationchange后调用instance.update()（如swiper.update()） - 在 CSS 中显式设置容器宽高（哪怕
min-height: 1px），避免渲染时高度塌陷影响插件测量 - 调试时打印
element.offsetWidth和window.innerWidth，确认值是否合理 —— 平板常见问题是初始值为 0 或远小于预期
移动端 viewport 和 zoom 设置让插件坐标/拖拽完全错乱
插件内部常通过 clientX/clientY 或 getBoundingClientRect() 计算位置。若 viewport 允许用户缩放（user-scalable=yes）或设置了错误的 initial-scale，坐标系就会漂移，拖拽偏移、弹层定位失准。
