如何使用javascript使div或对象逐渐移动到鼠标点击点？

所以我有一个物体或div，是一个10x10像素的正方形。我希望能够单击浏览器窗口中的某个位置，使div逐渐移向我单击的点。

jQuery代码

$("body").bind("click", function(e){
  var str = "( " + e.pageX + ", " + e.pageY + " )";
  $("span").text("Clicked  at " + str);
});

获得此信息后，您需要更新div.style.left和div.style.top

jQuery CSS HTML 你好

$(document).click(function(event) {
    var x = event.pageX,
        y = event.pageY;

    $('div').animate({
        top: y,
        left: x
    }, 1000);
});

div {
    background: red;
    padding: 5px;
    position: absolute; 
}

<div>hello</div>

$(document).click(function(event) {
    $('#divID').css({
       'position': 'absolute', 
       'left': event.clientX + document.body.scrollLeft, 
       'top': event.clientY + document.body.scrollTop });
});