前端ABC概叙
HTML5中的元素都是可以拖放的，拖放可以分成两个动作。
在某个元素上按下，然后开始移动鼠标，在移动的过程中，只要没有松开鼠标，将会不断产生拖动事件，这个过程称为“拖”。
把被“拖”的移到另一个元素上并松开鼠标，这个动作被称为“放”。
拖放操作“拖”和“放”两个动作组成。
了解拖放相关操作
被拖动的元素
ondragstart：开始拖动触发此事件 ondrag：拖动时不断触发此事件 ondragend：拖动结束触发此事件
被拖动元素经过的元素
ondragenter：被拖动的元素进入此元素范围内触发此事件 ondragover：被拖动的元素进入此元素范围内拖动时会不断的触发此事件 ondraglcave：被拖动的元素离开此元素范围内触发此事件 ondrop：被拖动的元素放到了此元素里触发此事件
了解DataTransfer对象
拖动触发的事件对象里有一个dataTransfer属性，该属性值是一个DataTransfer对象，通过此对象，可以让拖放操作实现更丰富的功能，例如存取数据，设置拖放行为等，在次就不做跟详细的介绍了。更详细请参考：HTML5中dataTransfer对象应用详解
启动“拖”
在Html5中 < img../ >元素默认是可以拖动的；而< a../ >元素只要设置了href属性，默认也是可以拖动的。
对于其他元素来说，想要把他变成拖动的，只要把该元素的draggable属性设置为true即可。
<div draggable="true"></div>
接受“放”
在拖动的过程中，不管是拖动< img../ >元素还是< div../ >元素，拖动时都显示了一个“禁止”的图标，这表明被拖动到“目的地”并不接受此拖动元素，这是因为document对象默认是阻止了此拖动事件，而其它HTML元素也是位于document对象内的，因此它们也不能接受“放”。
为了document对象可以接受“放”，可以为document对象的ondragover事件指定监听器，返回一个false，取消document对象对拖动事件的默认行为，这样，拖动时就不会显示“禁止”的图标了，如果只需要对某一个HTML元素进行接受，那就将此元素对象的ondragover事件指定监听器，返回一个false。
<script>
document.ondragover = function(event){
return false;
}
</script>