`
AngelAndAngel
  • 浏览: 230657 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

jquery 源码初探,一步步实现自己的jquery(三)

阅读更多
   上两篇简单的介绍了jquery的一些知识,也模拟了一下jquery的调用方式,下面我们整点更像的,jquery不是使用#来指定Id吗,我们也来试试,给我们的TestClass类添加一个selector来存储我们要找的目标,并且添加一个val方法来获取值和赋值
改版的TestClass如下:

 
     (function(){
     TestClass=function (selector){
     return new TestClass.fn.init(selector);
  }
  TestClass.fn=TestClass.prototype={
    init:function(selector){
    this.selector=selector;
    return this;
    },
    val:function(value){
     if(!(this.selector&&this.selector.indexOf("#")==0)){
        return ;
      }
	var id=this.selector.substring(1);
         var obj=document.getElementById(id);
	 if(!value){
              return obj.value;
	 }else{
              obj.value=value;
	  }

    }
 }
 TestClass.fn.init.prototype=TestClass.fn;
 var $=TestClass;
 window.$=$;
 window.TestClass=TestClass;
  


})()

alert($("#myinput1").val());
$("#myinput1").val("xxxtest");
  


上面的判断比jquery要少很多,满足基本功能,对于select等等这些元素,还需继续扩招下去,这个比较简单。
以上在IE和火狐都会通过。
  现在总结一点东西:
  

         
  • 1,之所以要用匿名函数是避免出现方法或者属性,变量与其他的重复,在这个 里面定义的函数,在外面是不能直接调用的。
  •       
  • 2,大量利用js prototype属性,对扩展类的方法有很大作用,它是一个给类的对象添加方法的方法。
  •   
                  

   现在jquery有很多扩展出来的插件,为整个框架带来生机,这也是它成为霸主的利剑,下一篇面我们就看看是怎样扩展它的功能的。


  
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics