连缀功能

一下都是我自己对代码的理解，但也是我自身也是弱菜一枚，很多地方可能理解有错，也希望大神们帮我指正。。我也会定期发错误总结写成博客！

所用代码为李炎恢老师博客前端代码！！！！

$().getId(‘box’).css(‘color’, ‘red’).html(‘标题’).click(function(){alert(‘a’)});

这段代码就是连缀功能。。很多人第一反正肯定是觉得很直观，清楚明了简洁，但为什么可以这么写呢。。
我们知道。在javascript中对象是有方法的，我们就把这每一个类似css(‘color’, ‘red’)当成为一种方法不就可以调用了么。。而css(‘color’, ‘red’)返回一个对象。这样我们就可以接着调用之后的方法了。。

那么既然知道这点。我们该如何写呢。肯定会想到写一个构造函数然后向其中加入各种方法。那我们就来看一下

function Base(){     this.elements=[]; //用数组来保存获得的节点    this.getId=function(id){         this.elements.push(document.getElementById(id)); //把获取的节点放入数组里        return this;        };    this.css=function(attr,value) {          for(vari= 0;i<this.elements.length;i++) {             this.elements[i].style[attr]= value;            }            return this;        }    }

先写几个最基本的功能吧。获取ID之后给其CSS样式
这样我们需要new一个对象来用其中的方法但是呢。我们所有的方法都放在构造函数里，不方便看和整理，所以我们不如分离出来，那如何分离呢。。这时我们就会想到原型函数

Base.prototype.css=function(attr,value) {    for(vari= 0;i<this.elements.length;i++) { //如果获得的是tagName可能有很多就需要循环        this.elements[i].style[attr]= value;        }        return this;}

这样呢我们就可以和以前一样调用了，而且十分清楚每个方法是什么。但问题来了。。原型的弊端，那就是共享 也就是第一个代码中的this.elements=[]; ，也就是说如果我们其他方法需要用到this.elements[]那么所有的方法中的都会发生变化（例如设置背景颜色，就不在这举例了），，所以我们要将这个代码分离出来，那如何分离呢，我们可以这样想，在每次创建对象的时候就创建一个数组。可以是吧

var $=function(){     return new Base(); };

这样我们每次调用这个方法就会新建一个数组。。这样就不会共享咯哟~~

那么我们也就实现了$().getId('box').css('color', 'red')

第一次写，可能逻辑上还有些问题，希望广大看友留下意见。我慢慢改正