jquery 원본 탐색, 한 걸음 한 걸음 자신의 jquery 실현(3)

지난 두 편에서 간단하게 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와 화호에서 모두 통과할 겁니다.
이제 요약할 사항이 있습니다.
  
     
4
  • 1, 익명 함수를 사용하는 이유는 방법이나 속성, 변수가 다른 것과 중복되는 것을 피하는 것이다. 이 안에 정의된 함수는 밖에서 직접 호출할 수 없다
  •       
    4
  • 2 js prototype 속성을 대량으로 활용하면 확장 클래스의 방법에 큰 역할을 한다. 이것은 클래스의 대상에 방법을 추가하는 방법이다
  •   
                      
    현재 jquery는 확장된 플러그인이 많아서 전체 프레임에 생기를 불어넣는다. 이것도 패주가 되는 날카로운 검이다. 다음 편에서는 어떻게 그 기능을 확장하는지 살펴본다.

    좋은 웹페이지 즐겨찾기