js模仿jquery 框架淡入淡出动画

//IIFE 立即执行函数 主要目的是做的一些封装，防止变量全局污染，以及保证内部变量的安全；
(function () {
    var push = [].push;//获取数组对象的push方法对象
    var splice = [].splice;//获取数组对象的solice方法对象
    var forEach = [].forEach;//获取数组对象的forEach方法对象
    /**
     * 此对象暴露在window.O
     * @param query
     */
    function select(query) {
        return new select.prototype.init(query);
    }

    /**
     * 改变原型链 添加数组相对应的方法和属性
     * @type {{}}
     */
    select.prototype = {
        me: this,
        length: 0,
        splice: function () {
        },
        get: function (index) {
            index = (index + this.length) % this.length;
            return this[index]; // 返回值为dom
        },
        eq: function (index) {
            return select(this.get(index));
        },
        each: function (callback) {
            forEach.call(this, callback);
            return this; // 链式编程
        },
        extend: function () {//添加扩展方法
            var obj;//方法对象
            for (var i = 0, l = arguments.length; i < l; i++) {
                obj = arguments[i];
                for (var k in obj) {
                    if (obj.hasOwnProperty(k)) { //判断是否具有该方法
                        this[k] = obj[k];//复制方法到this 也就是学习了别人的方法
                    }
                }
            }
        },
        init: function (query) {
            //定义dom元素
            var doms;
            doms = document.querySelectorAll(query);//查出所有dom元素
            push.apply(this, doms);//将带有下标 0，1，2的字典添加数组push方法
        }
    };


    select.oo = select.prototype.init.prototype = select.prototype;

    select.oo.extend({
        //target eg:{in or out time} {in:1000}
        fade: function (mode, time) {
            var inti = 30;//刷新间隔时间
            this.each(function (el) {
                var du = inti / time;
                var sudu = 0;
                //透明度 100% 变为 0%
                el.timer = setInterval(function () {
                    sudu += du;
                    console.log(sudu);
                    if ('in' === mode) {
                        el.style.opacity = sudu;
                    } else {
                        el.style.opacity = 1 - sudu;
                    }
                    if (sudu > 1) {
                        clearInterval(el.timer);
                        if (mode === 'in') {
                            el.style.display = block
                        } else {
                            el.style.display = none
                        }
                    }
                }, inti);
            })
        },
        fadeIn: function (time) {
            this.fade('in', time)
        },
        fadeOut: function (time) {
            this.fade('out', time)
        }
    });

    window.O = select;

})();