模拟jQuery的一些功能

//getStyle

 function getStyle(obj,attr){
     if(obj.currentStyle){
         return obj.currentStyle[attr];
     }
     else{
         return getComputedStyle(obj,false)[attr];
     }
 }

//getByClass

 function getByClass(oParent,sClass){
     var arr = [];
     var aEle = oParent.getElementsByTagName("*");
     for(var i = 0;i < aEle.length;i ++){
         if(aEle[i].className == sClass){
             arr.push(aEle[i])
         }
     }
     return arr;
 }

//myAddEvent

 function myAddEvent(obj,sEv,fn){
     //改造后return false 能同时具有阻止冒泡和默认事件的作用
     if(obj.attachEvent){
         obj.attachEvent("on"+sEv,function(){
             if(false == fn.call(obj)){
                 event.cancelBubble = true;
                 return false;
             }
         });
     }
     else{
         obj.addEventListener(sEv,function(ev){
             if(false == fn.call(obj)){
                 ev.cancelBubble = true;
                 ev.preventDefault();
             }
         },false);
     }
 }

//元素获取

 function jQuery(vArg){
     this.elements = [];
     switch(typeof vArg){//typeof
         case "function":
             myAddEvent(window,"load",vArg);
             break;
         case "string":
             switch(vArg.charAt(0)){
                 case "#":
                     var obj = document.getElementById(vArg.substring(1));
                     this.elements.push(obj);
                     break;
                 case ".":
                     this.elements = getByClass(document,vArg.substring(1));
                     break;
                 default:
                     this.elements = document.getElementsByTagName(vArg);
             }
             break;
         case "object":
             this.elements.push(vArg);
     }
 }

//$拥有jQuery功能

 function $(vArg){
     return new jQuery(vArg);
 }

//click()

 jQuery.prototype.click = function(fn){
     for(var i = 0;i < this.elements.length;i ++){
         myAddEvent(this.elements[i],'click',fn);
     }
     return this;//支持链式操作
 };

//css()

 jQuery.prototype.css = function(attr,value){
     if(arguments.length == 2){
         for(var i = 0;i < this.elements.length;i ++){
             this.elements[i].style[attr] = value;
         }
     }
     else{
         if(typeof attr == "string"){//typeof
             return getStyle(this.elements[0],attr);//获取时不能链式操作，因为到这里就返回了。带单位
         }
         else{
             for(var i = 0;i < this.elements.length;i ++){
                 var k = "";
                 for(k in attr){
                     this.elements[i].style[k] = attr[k];
                 }
             }
         }
     }
     return this;
 };

//toggle()　　>>　　0>fn1; 1>fn2; 2>fn3

 jQuery.prototype.toggle = function(){
     var _arguments = arguments;
     for(var i = 0;i < this.elements.length;i ++){
         addToggle(this.elements[i]);
     }
     function addToggle(obj){
         var count = 0;
         myAddEvent(obj,"click",function(){
             _arguments[count++ % _arguments.length].call(obj);
         });
     }
     return this;
 };

//attr()

 jQuery.prototype.attr = function(name,value){
     if(arguments.length == 2){
         for(var i = 0;i < this.elements.length;i ++){
             this.elements[i][name] = value;
         }
     }
     else{
         return this.elements[0][name];
     }
     return this;
 };

//eq()

 jQuery.prototype.eq = function(num){
     return $(this.elements[num]);//普通的dom对象变成jQuery对象。单一dom对象的处理方式
 };

//find()

 jQuery.prototype.find = function(str){
     var aResult = [];
     for(var i = 0;i < this.elements.length;i ++){
         switch(str.charAt(0)){
             case ".":
                 var aEle = getByClass(this.elements[i],str.substring(1));
                 aResult = aResult.concat(aEle);
             default:
                 var aEle = this.elements[i].getElementsByTagName(str);
                 appendArr(aResult,aEle);
         }
     }
     var newJquery = $();
     newJquery.elements = aResult;//数组dom对象的处理方式
     return newJquery;
 };

 function appendArr(arr1,arr2){
     for(var i = 0;i < arr2.length;i ++){
         arr1.push(arr2[i]);
     }
 }

//index()

 jQuery.prototype.index = function(){
     return getIndex(this.elements[0]);
 };

//getIndex()

 function getIndex(obj){
     var aBrother = obj.parentNode.children;
     for(var i = 0;i < aBrother.length;i ++){
         if(aBrother[i] == obj){
             return i;
         }
     }
 }

//bind()

 jQuery.prototype.bind = function(sEv,fn){
     for(var i = 0;i < this.elements.length; i++){
         myAddEvent(this.elements[i],sEv,fn);
     }
 };

//extend()

 jQuery.prototype.extend = function(name,fn){
     jQuery.prototype[name] = fn;
 };

//size()

 $().extend("size",function(){
     return this.elements.length;
 });

//animate()插件

 $().extend("animate",function(json){
     for(var i = 0;i < this.elements.length;i ++){
         startMove(this.elements[i],json);
     }
     function startMove(obj,json,fnEnd){
         clearInterval(obj.timer);
         obj.timer = setInterval(function(){
             var oStop = true;
             for( var attr in json){
                 var cur = 0;
                 if(attr == "opacity"){
                     cur = Math.round( parseFloat( getStyle(obj,attr) ) * 100 );
                 }
                 else{
                     cur = parseInt( getStyle(obj,attr) );
                 }

                 var speed = (json[attr] - cur) / 7;
                 speed = speed > 0 ? Math.ceil(speed) : Math.floor(speed);

                 if(cur != json[attr]){
                     oStop = false;
                 }
                 if(attr == "opacity"){
                     obj.style.filter = 'alpha(opacity:'+(cur+speed)+')';
                     obj.style.opacity = (cur + speed) / 100;
                 }
                 else{
                     obj.style[attr] = cur + speed + "px";
                 }
             }
             if(oStop){
                 clearInterval(obj.timer);
                 fnEnd&&fnEnd();
             }
         },30);
     }
 });

//drag()插件

 $().extend('drag',function(){
     for(var i = 0;i < this.elements.length;i++){
         drag(this.elements[i]);
     }
     function drag(obj){
         var disX = 0;
         var disY = 0;
         obj.onmousedown = function(ev){
             //这里位置的计算一定是mousedown的时候
             var oEvent = ev || event;
             disX = oEvent.clientX - parseInt( getStyle(obj,"left") );
             disY = oEvent.clientY - parseInt( getStyle(obj,"top") );

             if(obj.setCapture){
                 obj.onmousemove = mouseMove;
                 obj.onmouseup = mouseUp;
                 obj.setCapture();
             }
             else{
                 document.onmousemove = mouseMove;
                 document.onmouseup = mouseUp;
             }
             function mouseMove(ev){
                 var oEvent = ev || event;

                 obj.style.top = oEvent.clientY - disY + "px";
                 obj.style.left = oEvent.clientX - disX + "px";
             }
             function mouseUp(){
                 this.onmousemove = this.onmouseup = null;
                 if(obj.releaseCapture){
                     obj.releaseCapture();
                 }
             }
             return false;
         };
     }
 });