拖拽事件

let div1 = document.getElementById('div1') div1.onmousedown = function (e){ /* 按下的时候 获取点的位置 到盒子边界距离 / let areaX = e.clientX - div1.offsetLeft; let areaY = e.clientY - div1.offsetTop; document.onmousemove = function (e){ / 移动的时候获取的client的动态距离 - 盒子内点的到边缘的固定距离 / / 最后获得的 就是 盒子到文档的距离 */ div1.style.left = e.clientX - areaX + 'px' div1.style.top = e.clientY - areaY + 'px' } } div1.onmouseup = function (){ document.onmousemove = null; }