(function (global, factory) {
if (typeof module === "object" && typeof module.exports === "object") {
module.exports = factory();
} else if (typeof define === "function" && define.amd) {
define("MyAutoComponent", [], function () {
return factory();
});
} else {
if (!global.$$) {
global.MyAutoComponent = global.$$ = factory();
} else {
global.MyAutoComponent = factory();
}
}
})( this, function() {
function MyAutoComponent() {
return MyAutoComponent.fn.init;
};
MyAutoComponent.fn = MyAutoComponent.prototype = {
el: document.querySelector('body'),
init: function() {
var args = arguments;
if (args.length === 0) {
return MyAutoComponent.fn;
}
else if (typeof args[0] === 'string' && args.length === 1 ) {
var elements = document.querySelectorAll(args[0]);
var i =0;
l = elements.length;
for (; i<l; i++) {
this.el = elements[i];
return MyAutoComponent.fn;
}
} else if ( typeof args[1] === "boolean" && args.length === 2 ) {
var elements = document.querySelectorAll(args[0]);
var i = 0;
l = elements.length;
for (; i < l; i++) {
this.el = elements[i];
if (args[1]) {
return this.el;
} else {
return MyAutoComponent.fn;
}
}
} else {
return MyAutoComponent.fn;
}
},
rename: function(name){
if(window) {
window[name] = new MyAutoComponent;
}
},
on: function(){
var args = arguments;
if (!args.length) {
return MyAutoComponent.fn;;
}
var name = args[0];
var callback = function () { };
var childrenName = '';
var isBuhuo = 'false';
if (args[1] && typeof args[1] === "function") {
callback = args[1] ;
}
if (args[1] && typeof args[1] === 'string') {
childrenName = args[1];
}
if (args[2] && args[2] === "function") {
callback = args[2];
}
if (childrenName) {
this.el.addEventListener(name, function(e){
var target = e.target;
callback.call( target, e );
}, isBuhuo);
} else {
this.el.addEventListener(name, function(e){
callback.call(this.el, e);
}, isBuhuo);
}
},
render: function(list) {
var list = list || [];
var i = 0;
var l = list.length;
var html = '';
for (; i < l; i++) {
html += '<li>'+ list[i] +'</li>';
}
return html;
},
Component: function(options) {
var list = options.list; ///////////////渲染的数据;
var allList = options.allList; /// 总数据;
var el = options.el; /// 插入的地方;
var value = options.value || ''; /// 更改是的数据;
list = this.searchData(allList, value); //返回匹配的数据;
var html = this.render( list ); // 渲染, 返回虚拟dom;
var dom = document.querySelector(el); // 获取插入的dom;
dom.innerHTML = html; // 插入;
return list;
},
// 找到模糊匹配的数据;
searchData: function(data, srarchdata) {
var i=0;
var l = data.length;
var arr = [];
if (!srarchdata) {
return data;
}
for (i; i<l; i++) {
var patten = new RegExp(srarchdata, 'i');
var isTrue = data[i].toString().search(patten);
if (isTrue !== -1) {
arr.push(data[i]);
}
}
return arr;
}
}
return new MyAutoComponent();
} )
网友评论