第16章 HTML5脚本编程

16.1 跨文档消息传递

?????? 跨文档消息传送（cross-document messaging），有时候简称XDM，指的是在来自不同域的页面间传递消息。

16.2 原生拖放

16.2.1 拖放事件

?????? 拖动某元素时，将一次触发下列事件：

?????? （1）dragstart

?????? （2）drag

?????? （3）dragend

?????? 上述三个事件的目标都是被拖动的元素。

?????? 当某个元素被拖动到一个有效的放置目标上时，下列事件会依次发生：

?????? （1）dragenter

?????? （2）dragover

?????? （3）dragleave或drop

162.2 自定义放置目标

?????? 可以把任何元素变成有效的放置目标，方法是重写dragenter和dragover事件的默认行为。

16.2.3 dataTransfer对象

?????? 为了在拖放操作时实现数据交换，IE5引入了dataTransfer对象，它是事件对象的一个属性，用于从被拖动元素向放置目标传递字符串格式的数据。因为它是事件对象的属性，所以只能在拖放的事件处理程序中访问dataTransfer对象。

16.2.4 dropEffect与effectAllowed

?????? 通过dataTransfer对象还可以确定被拖动的元素以及作为放置目标的元素能够接收什么操作。通过dataTransfer对象的两个属性dropEffect和effectAllowed来确定。

?????? 通过dropEffect属性可以知道被拖动的元素能够执行哪种放置行为。要使用dropEffect属性，必须在ondragenter事件处理程序中针对放置目标来设置它。

?????? dropEffect属性只有搭配effectAllowed属性才有用。effectAllowed属性表示允许拖动元素的哪种dropEffect。必须在ondragstart事件处理程序中设置effectAllowed。

16.2.5 可拖动

?????? 默认情况下，图像、链接和文本是可以拖动的。文本只有在被选中的情况下才能拖动，而图像和链接在任何时候都可以拖动。

?????? HTML5为所有HTML元素规定了一个dragable属性，表示元素是否可以拖动。

16.2.6 其他成员

?????? HTML5规范规定dataTransfer对象还应该包含下列方法和属性：

（1）addElement(element)：为拖动操作添加一个元素。添加这个元素只影响数据（即增加作为拖动源而响应回调的对象），不会影响拖动操作时页面元素的外观。