拖拽的面向过程

一，面向过程的步骤代码与思路：

       Oimg.onmousedown=function(e){                                      鼠标按下的函数功能
           e.preventDefault()                                           阻止（默认值盒子跟一起动）
          
           var a = e.clientX-this.offsetLeft     
定义一个空间=点击的这个点到页面左边的距离-盒子到页面左边的距离
           var b=e.clientY-this.offsetTop
定义一个空间=点击的这个点到页面上面的距离-盒子到上面的距离
             document.onmousemove=function(e){                    鼠标开始移动的函数功能
（如果不用document的前缀，那么鼠标离开盒子将不会动，所以要用document而不能用Oimg）
           Oimg.style.left=e.clientX- a+"px"                           盒子的左边距离的移动=当前的点到页面的距离-点击的这个点到页面左边的距离-盒子到左边页面的距离   
           Oimg.style.top=e.clientY- b+"px"
盒子的上边距离的移动=当前的点到页面的距离-点击的这个点到页面左边的距离-盒子到上边页面的距离   
           }
       }
       Oimg.onmouseup=function(){
鼠标松开的函数功能将页面上的鼠标移动事件清除
          document.onmousemove = null;```