drop事件不触发是因为未阻止dragover的默认行为；浏览器默认禁用drop，必须在dragover中调用preventDefault()才能启用drop。
JavaScript 实现拖放功能，核心是正确绑定和处理 dragstart、dragover、drop 这三个事件；漏掉 dragover 的默认行为阻止，drop 就永远不会触发。
为什么 drop 事件不触发？
浏览器对 drop 有默认拦截机制：除非显式阻止 dragover 的默认行为，否则即使绑了 drop 监听器也不会执行。
-
dragstart：在被拖拽元素上触发，必须在此设置dataTransfer.setData()，否则无数据可传 -
dragover：在目标区域持续触发，必须调用event.preventDefault()，否则drop被禁用 -
drop：用户松手时触发，此时才能读取dataTransfer.getData()并执行实际逻辑
dataTransfer 的关键用法和限制
dataTransfer 是拖放过程中的数据载体，但只支持字符串类型，且仅在同源页面间可靠传输；跨域或跨窗口时可能为空。
- 只能用
setData('text/plain', 'some-value')或setData('text/html', ...)，不支持对象或 JSON 直传 - 读取时需用相同 MIME 类型：比如
getData('text/plain')，类型不匹配返回空字符串 - 拖拽文件时可用
event.dataTransfer.files（FileList），但这是特例，不走setData/getData
如何让元素变成可拖拽的？
不是所有元素默认可拖，需手动设置 draggable="true" 属性，否则 dragstart 根本不会触发。
立即学习“Java免费学习笔记（深入）”；
拖我放这里
注意：移动端不支持原生 drag/drop 事件，需要额外用 touchstart/touchmove 模拟，而且 dataTransfer 在 iOS Safari 中长期不可靠——这点常被忽略，上线前务必真机验证。
