前端手动实现拖拽移动并在边界不被遮挡

//clickId为点击的元素id，moveId为移动的元素id
function setMove(clickId,moveId) {
    const elClick = document.getElementById(clickId);
    const elMove = document.getElementById(moveId);
    elClick.onmousedown = function (ev) {
        var event = window.event || ev;
        // 获取屏幕中可视化的宽高的坐标
        var dx = event.clientX - elMove.offsetLeft; 
        var dy = event.clientY - elMove.offsetTop;
        const boxWidth = elMove.offsetWidth;
        const boxHeight = elMove.offsetHeight;
        //实时改变目标元素chatTab的位置
        document.onmousemove = function (ev) {
            var event = window.event || ev;
            var _x = ev.clientX - dx;
            var _y = ev.clientY - dy;
            if(_x < 0) {
                _x = 0;
            }
            if (_x > document.documentElement.clientWidth - boxWidth) {
                _x = document.documentElement.clientWidth - boxWidth;
            }
            if (_y < 0) {
                _y = 0;
            }
            if (_y > document.documentElement.clientHeight - boxHeight) {
                _y = document.documentElement.clientHeight - boxHeight;
            }
            elMove.style.left = _x + 'px';
            elMove.style.top = _y + 'px';
        }
        //抬起停止拖动
        document.onmouseup = function () {
            isMouseUp = true;
            document.onmousemove = null;
            document.onmouseup = null;
            stopPropagation(event);
        }
    }
}