(一)拖拽

box.onmousedown=function(eve){                //拖拽 mousedown->mousemove->mouseup
    var eve=eve||window.event;                //eve指所有代码的集合，通过它可以获取事件的各种属性。
    var pos=box.getBoundingClientRect();    //getBoundingClientRect()用于获取元素的left、top、right、bottom。offset获取相对于父级的left和top。getBoundingClientRect()获取相对于窗口的left、top、right、bottom。

    var oX=eve.clientX-pos.left;            //clientX指相对于窗口的坐标。
    var oY=eve.clientY-pos.top;


    document.onmousemove=function(eve){
        var eve=eve||window.event;
        left=eve.clientX-oX;
        top1=eve.clientY-oY;
        box.style.left=left+'px';
        box.style.top=top1+'px';
        if(left<0){
            box.style.left=0+'px';
        }
        if(top1<0){
            box.style.top=0+'px';
        }
    }


    document.onmouseup = function() {
        document.onmousemove = null;
    }


}