//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;
})();
网友评论