拖拽元素

<style>
    div {
        width: 100px;
        height: 100px;
        background-color: yellow;
        border-radius: 100px;
        position: absolute;
        top: 0;
        left: 0;
    }
</style>

   var div = document.getElementsByTagName('div')[0];
        var disX,
            dixY;
        div.onmousedown = function (e) {

            disX = e.pageX - div.offsetLeft;
            disY = e.pageY - div.offsetTop;



            document.onmousemove = function (e) {
                var event = e || window.event;
                // console.log(e.pageX + " " + e.pageY)
                div.style.top = e.pageY - disY + 'px';
                div.style.left = e.pageX - disX + 'px';
            }



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


        }