拖拽的面向对象

一、面向对象的思路与代码步骤：
···
function Drg(box4){ （Drg是一个构造函数，box4是一个参数）
this.ele=document.getElementById(box4)
var self = this; （保留这个this.ele的值）
this.ele.onmousedown=function(e){ （鼠标点击的函数事件）
self.start(e);
}

        this.start=function(e){                                                 
            
         e.preventDefault()        
           var t = e.clientX-this.ele.offsetLeft;
           var y = e.clientY-this.ele.offsetTop;
           document.onmousemove=function(e){             （点击的时候要调用move的这个功能）
           self.move(e,t,y)
           }
        } 
        
        this.move=function(e,t,y){
                
               this.ele.style.left = e.clientX-t + "px"
               this.ele.style.top = e.clientY-y + "px"
            //   console.log(e.clientX,e.clientY)
        }
        this.stop=function(){  当鼠标松开的时候，要将移动事件清除）
        
             document.onmousemove=null
        }        
        
        this.ele.onmouseup=function(){
                self.stop()
        }
            
    }

总结：经过面向过程与面向对象的学习，我觉得面向过程好理解一些，面向对象中的this
很容易混淆，面向过程与面向对象的代码差不多，思路不一样，有时候听课听着就不知道this到底在哪里，到底指什么，有时候单学知识点能懂，但是运用起来就乱了