关于原生JavaScript实现DOM拖拽事件（元素拖拽）

问题：

在html中创建多个元素，要求能用鼠标点下进行平移，松开固定位置。类似于电脑桌面图标的平移。

问题分析：

首先，类比于电脑桌面的图标拖拽平移，鼠标按下时进入事件，记录鼠标相对元素位置，然后鼠标移动，动态改变元素定位，最后鼠标松开，位置不再改变。
用到绑定的事件有：onmousedown,onmousemove,onmouseup。
值得注意的是：分别对哪个元素绑定相应的事件。

1. 鼠标按下，应该是在元素中按下，这个onmousedown绑定于元素上。
2. 鼠标移动，是在整个界面中移动，故绑定在document上。
3. 鼠标放开，也是在整个页面中放开，绑定在document上。

需要理解（重点）：

在事件触发时，每个触发事件“都”会传入一个对象（关于鼠标位置，点击按钮等并且这个对象只有IE8及以下的浏览器不支持），只需要在绑定事件时写入形参，便可调用该对象的属性。值得一提的是，在获得鼠标定位时，便是采用此方法。

解决方案:

获取鼠标定位，动态改变元素定位。

代码：

//js代码：
window.onload = function() {
   
    var box1 = document.getElementById('box1');
    //下面写移动函数。
    function move(ele) {
   
        ele.onmousedown = function(e) {
   
            e