模拟jQuery

1.实现工厂函数

var $ = function (id) {
    return document.getElementById(id)  
}

2.实现hide()

在实现$("image1") 之后想要隐藏，如何。。。

HTMLElement.prototype.hide = function(){
    this.style.display = 'none';
}

然而IE6-8不支持HTMLElement原型，我们使用Function原型扩展

var F = function(){};
F.prototype.hide = function(){
    this?.style.display = "none";
};
new F().hide();

知识点

只要new表达式之后的constructor返回return一个引用对象（数组，对象，函数），都将覆盖new创建的匿名对象。如果返回（return）一个原始类型（无return时其实为return原始类型undefined），那么就返回new创建的匿名对象。

重新解释

new F()如果没有返回值(Undefined类型)，或返回值是5种基本型（Undefined类型、Null类型、Boolean类型、Number类型、String类型）之一，则new F()我们可以看成是原型扩展方法中的this; 如果返回是是数组啊、对象啊什么的，则返回值就是这些对象本身，此时new F() ≠ this。

我们使用this间接调用

var F = function(){
    this.element = document.getElementById(id)
}

F.prototype.hide = function(){
    this.element.style.display = 'none';
}
new F("image").hide()  //可以实现

jQuery中实现链式调用 就是 return this

暴露与重用元素的获取方法

var F = function(id) {
    return this.getElementById(id);
};
F.prototype.getElementById = function(id) {
    this.element = document.getElementById(id);
    return this;
};
F.prototype.hide = function() {
    this.element.style.display = "none";
};

new F("image").hide(); 

我还是喜欢$ , 不喜欢new

var $ = function(id){
    return new F(id)
}

隐藏图片的代码可以是：

$("image").hide()

支持IE6-IE7

未完待续···········