JavaScript基础学习--11 定时器管理、函数封装

Demos：   https://github.com/jiangheyan/JavaScriptBase 

 

一、定时器管理

     1、var timer = null;  改为  oDiv.timer = null;（此时可以不写，因为oDiv存在时，undefined被clearInterval 兼容）

     2、正负值的处理：dir = parseFloat(getStyle(obj, attr)) < target ? dir : -dir;     //不让用户输正负值，直接用目标地和现在的地点大小判断，从而得出dir是正是负，再“加”给位移元素

     3、callback 回调函数的添加　　

　　

function doMove(obj, attr, dir, target, callback) {
    dir = parseFloat(getStyle(obj, attr)) < target ? dir : -dir;
    clearInterval(obj.timer);
    obj.timer = setInterval(function() {
        var speed = parseFloat(getStyle(obj, attr)) + dir;
        if (speed > target && dir > 0 || speed < target && dir < 0) {
            speed = target;
        }
        obj.style[attr] = speed + 'px';
        if (speed == target) {
            clearInterval(obj.timer);
            callback && callback(); //如果存在回调函数，则运行该函数
        }
    }, 30);
}
doMove(aDiv[i], 'top', 10, 500, function() {     //完成前面一系列函数操作（aDiv[i], 'top', 10, 500, ）之后需要运行的函数（核实运行看回调函数写在什么地方处于什么条件）
    doMove(_this, 'top', 10, 0);
});