页面元素简单移动

<div id="div1" style="position:absolute;top:100px;left:200px;width:100px;background-color:green;height:100px;"></div>
<button onclick="doMoveElement();">moveElement</button>

function doMoveElement(){
    var el = document.getElementById('div1');
    moveElement(el,240,200);
    
}
function moveElement(el,finalX,finalY){
    var moving = el.getAttribute('moving');
    if(moving){
        clearTimeout(moving);
    }
    doMove = function(el,finalX,finalY){
        var pox = parseInt(el.style.left);
        if(pox == finalX){
            clearTimeout(el.getAttribute('moving'));
            el.removeAttribute('moving');
            return;
        }
        else if(pox < finalX){
            //每次前进1/5,因而是具有"加速度"的
            pox = pox + Math.ceil((finalX - pox)/2);
        }   
        else if(pox > finalX){
            pox--;
        }
        el.style.left = pox + 'px';
        moveElement2(el,finalX,finalY);
    };
    moving = setTimeout(function(){
            doMove(el,finalX,finalY);
    },1000);
    el.setAttribute('moving',moving);

}