ie11完全不支持draggable属性，旧版edge拖拽行为不稳定，必须检测原生支持性并降级为pointer/touch事件模拟，统一用text类型setdata和json传递数据，禁用原生drag事件链路。
draggable="true" 在 IE11 和旧版 Edge 中根本无效
IE11 完全不支持 draggable 属性，哪怕写成 draggable="true"，也不会触发 dragstart 事件，控制台也无报错——它直接跳过整个拖拽流程。旧版 Edge（EdgeHTML 18 及更早）虽部分支持属性解析，但 dataTransfer.setData() 行为不稳定，drop 常静默失败。
用 pointerdown + mousemove 模拟拖拽链路
在检测到不支持原生拖拽时（例如 'draggable' in document.createElement('div') 返回 false），必须降级为手动事件模拟：
- 监听
pointerdown（兼容 IE11 的msPointerDown回退）获取初始坐标和目标元素 - 立即调用
event.preventDefault()阻止文本选中或默认行为 - 绑定
pointermove，用transform: translate(x, y)实时更新被拖元素位置 - 绑定
pointerup或lostpointercapture触发“投放”逻辑，再手动查找当前悬停的容器并执行插入 - 注意：不能依赖
document.elementFromPoint()在 IE11 中的返回值，应改用getBoundingClientRect()+ 坐标比对
移动端和旧浏览器共用 fallback 时的关键陷阱
别把桌面 fallback 逻辑直接复用到 iOS Safari 或 Android Chrome 上——它们虽支持 draggable 属性，但 dragstart 永远不触发。真实兼容方案必须统一走 touch/pointer 事件路径：
- 用
'ontouchstart' in window || window.navigator.maxTouchPoints > 0主动识别触控环境 - 即使写了
draggable="true"，也要在初始化阶段就禁用原生行为：element.addEventListener('dragstart', e => e.preventDefault()) -
setDragImage()在所有旧环境都不可靠，统一用绝对定位的克隆节点替代视觉反馈 - 目标区高亮不要依赖
dragenter/dragleave，改用pointermove节流后比对targetElement.contains(e.target)
dataTransfer 兼容性断层必须绕开
IE11 的 dataTransfer 对象只支持 setData('Text', value)（注意大小写），且无法读取自定义 MIME 类型；Firefox 旧版对 'text/html' 支持不一致。跨浏览器唯一稳态是：
- 始终用
e.dataTransfer.setData('Text', JSON.stringify({id: 'item-1'}))——'Text'（首字母大写）是 IE 唯一认的类型 - drop 侧统一用
e.dataTransfer.getData('Text')解析，再JSON.parse() - 完全放弃
effectAllowed和dropEffect，旧环境光标样式不可控，业务逻辑不依赖它
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
