第 26 话
搬家公司：拖放
鼠标就是你的起重机。Drag and Drop，把东西从这儿搬到那儿。
1. 让元素动起来
🏗️
搬家队长：
"默认情况下，HTML 元素是长在页面上的，拔都拔不下来。除非你给它贴上 `draggable` 标签。"
只需一个属性，图片就能被拖走了：
<img src="box.png" draggable="true">
2. 搬运三部曲
拖放过程就像一次搬家，分三步走：
第1步：打包 (ondragstart)
当用户开始拖动时，我们要把数据（比如图片的ID）打包好。
function drag(ev) {
ev.dataTransfer.setData("text", ev.target.id);
}
第2步：找新家 (ondragover)
默认情况下，浏览器不允许在一个元素里放下另一个元素。我们需要阻止这个默认行为（告诉浏览器：这里可以放！）。
function allowDrop(ev) {
ev.preventDefault(); // 关键！阻止默认拒绝行为
}
第3步：卸货 (ondrop)
松开鼠标时，把打包的数据取出来，把元素搬进去。
function drop(ev) {
ev.preventDefault();
var data = ev.dataTransfer.getData("text");
ev.target.appendChild(document.getElementById(data));
}
3. 实战演练
试着把下面的 Logo 拖进框框里：
把图片拖到这里
(如果图片不见了，刷新页面重置)