這裡寫的是乙個原生js實現拖拽的效果，首先：
1、實現拖拽的三大事件，是要首先清楚的
onmousedown （滑鼠按下的時候）、onmousemove（滑鼠移動的時候）、onmouseup（滑鼠鬆開的時候）
2、給目標元素加上onmousedown時間，記錄滑鼠按下的時候，滑鼠距離所在元素的位置（就是滑鼠距離所在元素邊界的距離left、top）記錄為disx、disy。要注意的是，要移動的是這個元素，就要算出滑鼠座標與這個元素邊界的距離，拖動過程中，滑鼠與元素邊界位置距離是不變的。
3、當onmousedown發生後，給document新增onmousemove事件，可以根據一下公司不斷重新整理目標元素的實時位置
---------------------
目標元素.left = oevent。clientx - disx + 'px';
目標元素.top = oevent .clienty - disy + 'px';
過程就是以上3個步驟，直接看原理也許晦澀難懂，這裡就用**來直接顯示吧；
var obox = document.getelementbyid('drag')
//1、給需要移動的元素新增onmousedown事件,給拖動做好準備
obox.onmousedown = function(evt)
//停止拖動
document.onmouseup = function()
}
在拖拽的過程中，每次都要算出這個top，left只也是很麻煩，在js有幾個很好用的屬性：
offsetleft：相對參照物的左邊距離
offsettop：相對參照物的上邊距離（就如box.offsettop，就是相對于父元素上邊邊距的距離）
offsetwidth：元素節點的寬度（相對於width，但是沒有單位）
offsetheight：元素節點的高度
offsetx：事件物件的屬性，用這個屬性，就可以不用計算滑鼠距離所在元素邊界的距離disx的值了，可以直接disx = oevent.offsetx;得到
offsety：事件物件的屬性，同理offsetx；
offsetparent：參照物父元素
這裡要注意的是，offsetleft / offsettop 都是唯讀的
---------------------
js拖拽事件
doctype html utf 8 js拖拽事件 title page style head page div body html 這裡寫的是乙個原生js實現拖拽的效果，首先 實現拖拽的三大事件，是要首先清楚的 onmousedown 滑鼠按下的時候 onmousemove 滑鼠移動的時候 onm...
js滑鼠拖拽事件
只記錄left，top同理。clientx 返回滑鼠相對於瀏覽器的水平座標 offsetleft 返回當前物件距離瀏覽器 父物件 的左側距離 offsetwidth 物件的可見寬度 onmousemove 滑鼠移動事件 連線點是滑鼠放在div上拖動時的位置 座標 不會改變的，起名字為unchangx...
js之拖拽事件
js之拖拽事件 api 拖拽事件是js原生的事件，使用時在div上新增draggable true 即可拖動該div 在拖動過程中，將激發多個事件，從而完成拖動 注意 1.瀏覽器塊 div等 預設禁止拖拽事件的拖放操作，所以若想監聽drop操作，需要在dragover中阻止元素發生預設的行為，然後就...