js库开发--参数传递及方法修改-CSDN博客

<!DOCTYPE html>
<html>
   <head>
       <meta charset="UTF-8">
       <title></title>
       <link rel="stylesheet" type="text/css" href="base.css"/>
       <script src="sizzle.js" type="text/javascript" charset="utf-8"></script>
   </head>
   <body>
       <input type="button" id="btn" value="click" />
       <div id="ids" >
           <span>12</span>
           <div class="a">11</div>
           <div class="a">12</div>
           <div class="a">13</div>
       </div>

       <div><p class="a">3</p></div>


       <p>3</p>
       <script>
           var Base=function(args){
               this.elements=[];
               if(typeof args=="string")//string证明附带参数进来
               {
                   for(var i=0;i<Sizzle(args).length;i++)
                   {
                       this.elements.push(Sizzle(args)[i]);
                   }
               }
               else if(typeof args=="object")
               {
                   if(args!=undefined)
                   {
                       this.elements[0]=args;
                   }
               }
           }
           var myquery=function(args){
               return new Base(args);
           }

//           //id弃用，使用sizzle来获取
//           Base.prototype.getid=function(args){
//               var thisid=document.getElementById(args);
//               return this.elements.push(thisid)
               return this;
//           };
           //tag
//           Base.prototype.gettags=function(args){
//               var tag=document.getElementsByTagName(args);
//               for(var i=0;i<tag.length;i++)
//               {
//                   this.elements.push(tag[i])
//               }
//               return this;
//           }
           //css
           Base.prototype.css=function(attr,value)
           {
               //console.log(arguments.length)
               if(typeof arguments[0]=="object"&&arguments.length==1)//传递的对象
               {
                   for(var i=0;i<this.elements.length;i++)
                   {
                       //alert(this.elements)
                       for(var key in arguments[0]){
                            this.elements[i].style[key]=arguments[0][key];
                        }
                   }
               }
               else
               {
                   console.log("b")
                   for(var i=0;i<this.elements.length;i++)
                   {
                       if(arguments.length==1)
                       {
                           if(typeof window.getComputedStyle!=undefined)
                           {
                               //复合属性值无从获取在ie和火狐里面
                               return document.defaultView.getComputedStyle(this.elements[i],null)[attr];
                           }
                           else if(typeof this.elements[i].currentStyle!=undefined)
                           {
                               //console.log(this.elements[i].currentStyle[attr])
                               return this.elements[i].currentStyle[attr];
                           }
                       }
                       else
                       {
                           this.elements[i].style[attr]=value;
                       }

                   }
               }

               return this;
           }
           //html
           Base.prototype.html=function(args){
               console.log(this.elements.length)
               for(var i=0;i<this.elements.length;i++)
               {
                   if(arguments.length==0)
                   {
                       return this.elements[i].innerHTML;
                   }
                   else
                   {
                       this.elements[i].innerHTML=args;
                   }

               }
               return this;
           }
           //class
//           Base.prototype.getclass=function(attr,area){
//               //Sizzle(".a")[1]
//               var param=null;
//               if(arguments.length==2)
//               {
//                   for(var i=0;i<Sizzle(area+" ."+attr).length;i++)
//                   {
//                       this.elements.push(Sizzle(area+" ."+attr)[i]);
//                   }
//               }
//               else
//               {
//                   var classes=document.getElementsByTagName("*");
//                   for(var i=0;i<classes.length;i++)
//                   {
//                       if(classes[i].className==attr)
//                       {
//                           //console.log(classes[i])
//                           this.elements.push(classes[i]);
//                       }
//                   }
//               }
//               return this;
//           }
           //eq方法
           Base.prototype.eq=function(num){
               var tempelement=this.elements[num];
               this.elements=[];
               this.elements[0]=tempelement;
               return this;
           }
           //addclass
           Base.prototype.addclass=function(classname){
               for(var i=0;i<this.elements.length;i++)
               {
                   //去重
                   if(!this.elements[i].className.match(new RegExp('(\\s|^)'+classname+'($|\\s)')))
                   {
                       this.elements[i].className+=" "+classname
                   }

               }
               return this;
           }
           //removeclass
           Base.prototype.removeclass=function(classname){
               for(var i=0;i<this.elements.length;i++)
               {
                   //去重
                   if(this.elements[i].className.match(new RegExp('(\\s|^)'+classname+'($|\\s)')));
                   {
                       this.elements[i].className=this.elements[i].className.replace(new RegExp('(\\s|^)'+classname+'($|\\s)')," ");
                   }

               }
               return this;
           }
//           //addcss
//           Base.prototype.addcss=function(num,selectortxt,csses,ind){
//               var sheet=document.styleSheets[num];
//               if(typeof sheet.insertRule!=undefined)
//               {
//                   sheet.insertRule(selectortxt+"{"+csses+"}",ind)
//               }
//               else if(sheet.addRule!=undefined)
//               {
//                   sheet.addRule(selectortxt,csses,ind)
//               }
//               return this;
//           }
//           //removecss
//           Base.prototype.removecss=function(num,ind){
//               var sheet=document.styleSheets[num];
//               if(typeof sheet.deleteRule!=undefined)
//               {
//                   sheet.deleteRule(ind)
//               }
//               else if(sheet.removeRule!=undefined)
//               {
//                   sheet.removeRule(ind)
//               }
//               return this;
//           }
           //插件扩展
           Base.prototype.extend=function(name,fn){
               Base.prototype[name]=fn;
           }
//           myquery().extend('bbb',function(){
//               alert("a")
//           })
//           myquery().bbb();
           //现代事件绑定

           Base.prototype.addevent=function(obj,type,fn){
               if(typeof obj.addEventListener!='undefined')
               {
                   obj.addEventListener(type,fn,false);
               }
               else
               {
                   if(!obj.events)
                   {
                       obj.events={};
                   }
                   if(!obj.events[type])
                   {
                       obj.events[type]=[];
                       if(obj.events["on"+type])//如果没有ontype点击事件，那么我们把fn存放到第一个type的位置
                       {
                           obj.events[type][0]=fn;
                       }
                   }
                   else
                   {
                       if(Base.prototype.addevent.compare(obj.events[type],fn))
                       return false;
                   }
                   obj.events[type][Base.prototype.addevent.countnum++]=fn;
                   obj["on"+type]=Base.prototype.addevent.exec;
               }
           }
           Base.prototype.addevent.countnum=1;//ie8一下事件计数器
           Base.prototype.addevent.exec=function(e){
               var e=event||window.event;
               for(var i in this.events[e.type])
               {
                   this.events[e.type][i].call(this,e);
               }
           }
           Base.prototype.addevent.compare=function(type,fn){

               for(var i in type)
               {
                   if(type[i]==fn)
                   {
                       return true;
                   }
               }
               return false;
           }
           //现代事件删除
           Base.prototype.removevent=function(obj,type,fn){
               if(typeof obj.removeEventListener!='undefined')
               {
                   obj.removeEventListener(type,fn,false);
               }
               else
               {
                   for(var i in obj.events[type])
                   {
                       if(obj.events[type][i]==fn)
                       {
                           delete obj.events[type][i];
                       }
                   }
               }
           }
console.log(myquery("div p").eq(0).css({"color":"red","background":"red"}))
//var objs=document.getElementById("btn");
//           myquery().addevent(objs,"click",fn1)
//           myquery().addevent(objs,"click",fn1)
//           myquery().addevent(objs,"click",fn1)
//           myquery().removevent(objs,"click",fn1)
//
//           function fn1(){
//               alert("a1"+this.value)
//           }
//           function fn2(){
//               alert("a2"+this.value)
//           }
//           function fn3(){
//               alert("a3"+this.value)
//           }
           //console.log(Sizzle("#ids .a")[2].innerHTML)
       </script>

   </body>
</html>