本文實例分析了JavaScript鏈式調用。分享給大家供大家參考，具體如下：

對$函數你已經很熟悉了。它通常返回一個html元素或一個html元素的集合，如下：

function$(){  var elements = [];  for(vari=0,len=arguments.length;i<len;++i){     var element = arguments[i];     if(typeof element ===”string”){       element = document.getElementById(element);     }     if(arguments.length==1){        return element;      }      elements.push(element);  }   return elements;}

但是，如果把這個函數改造為一個構造器，把那些元素作為數組保存在一個實例屬性中，并讓所有定義在構造器函數的prototype屬性所指對象中的方法都返回用以調用方法的那個實例的引用，那么它就具有了鏈式調用的能力。我首先需要把這個$函數改為一個工廠方法，它負責創建支持鏈式調用的對象。這個函數應該能接受元素數組形式的參數，以便我們能夠使用與原來一樣的公用接口。

(function(){  //use private class   function _$(els){    this.elements = [];     for(vari=0,len=els.length;i<len;i++){      var element = els[i];       if(typeof element ===”string”){        element = document.getElementById(element);       }       this.elements.push(element)     }   }    //The public interface remains the same.    window.$ = function(){       return new _$(arguments);    }})();

由于所有對象都會繼承其原型對象的屬性和方法，所以我們可以讓定義在原型對象中的那幾個方法都返回用以調用方法的實例對象的引用，這樣就可以對那些方法進行鏈式調用。想好這一點，我們現在就動手在_$這個私用構造函數的prototype對象中添加方法，以便實現鏈式調用

(function(){  //use private class  function _$(els){    //..省略之前上面的代碼  }  _$.prototype = {    each:function(fn){      for(var i=0,len=this.elements.length;i<len;i++){        fn.call(this,this.elements[i]);      }      return this;    },    show:function(prop,val){      var that = this;      this.each(function(el){        that.setStyle("display”,”block");      });      return this;    },    addEvent:function(type,fn){      var add = function(el){        if(window.addEventListener){         el.addEventListener(type,fn,false);        }else if(window.attachEvent){         el.attachEvent("on"+type,fn);        }      };      this.each(function(el){        add(el);      });      return this;    }  };  //The public interface remains the same.  window.$ = function(){    return new _$(arguments);  }})();

但是如果某個庫或者框架已經定義了一個$函數，那么我們的這個庫會將其改寫，有個簡單的辦法是在源碼中為$函數另去一個名字。但是如果你是從一個現有的庫獲得的源碼，那么每次代碼庫獲取更新的版本后 你都得重新改名字，因此這個方案并不是很好。好的解決辦法就是像下面一樣添加一個安裝器：