拖放是一种常见的特性，即抓取对象以后拖动到另一个位置。

在HTML5中，拖放是标准的一部分，任何元素都能够拖放。

• 在拖动目标上触发的事件（源元素）:

  • ondragstart - 用户开始拖动元素时候触发（触发一次）
  • ondrag - 元素正在拖动时触发（触发多次）
  • ondragend - 用户完成元素拖动后触发（触发一次）

• 释放目标时触发的事件（目标元素）：

  • ondragenter - 当被鼠标拖动的对象进入其容器范围内时触发此事件（触发多次）
  • ondragover - 当某被拖动的对象在另一个容器范围内拖动时触发此事件（触发多次）
  • ondragleave - 当被鼠标拖动的对象离开其容器范围内时触发此事件（触发多次）
  • ondrop - 在一个拖动过程中，释放鼠标键时触发此事件（触发一次）

注意⚠️：源元素和目标元素是一个相对的说法

在拖拽的过程中，我们可以使用dataTransfer（数据转换器）对象来传输数据，以便在拖拽操作结束的时候对数据进行其他操作。

这里列出这个对戏那个的常用方法：

• setData(format, data): 将指定格式的数据赋值给dataTransfer对象，参数format定义数据的格式，即数据的类型；data为待赋值的数据。

• getData(format): 从dataTransfer对象中获取指定格式的数据。

在同级目录下有个名为demo1.html的文件，可以体验一下～

进入后打开浏览器的控制面板，体验更佳～