[JQUERY] 어떻게 JQuery와 작업 체인입니까?

어떻게 JQuery와 작업 체인입니까?

해결법

1. ---

   1.특정 방법과 객체가있는 경우 각각의 방법은 방법과 객체를 반환하는 경우, 당신은 단순히 반환되는 객체의 메소드를 호출 할 수 있습니다.

   특정 방법과 객체가있는 경우 각각의 방법은 방법과 객체를 반환하는 경우, 당신은 단순히 반환되는 객체의 메소드를 호출 할 수 있습니다.

   var obj = {   // every method returns obj---------v
       first: function() { alert('first');   return obj; },
       second: function() { alert('second'); return obj; },
       third: function() { alert('third');   return obj; }
   }
   
   obj.first().second().third();
   

   DEMO : http://jsfiddle.net/5kkCh/

2. ---

   2.모두가이 때 방법 완료에 대한 참조를 반환하고된다. 예를 들어,이 간단한 객체를 가지고 :

   모두가이 때 방법 완료에 대한 참조를 반환하고된다. 예를 들어,이 간단한 객체를 가지고 :

    var sampleObj = function()
    {
    };
   
    sampleObj.prototype.Foo = function()
    {
        return this;
    };
   

   당신은이에 대한 참조를 반환하기 때문에이 모든 일 호출 체인 수 :

   var obj = new sampleObj();
   obj.Foo().Foo().Foo().Foo() // and so on
   

   jQuery를 단순히 다음이를 반환 작업을 수행합니다.

3. ---

   3.기본적으로 첫 번째 함수 호출 $ ( 'myDiv')는 각각의 후속 호출은 동일한 하나를 반환하고있는 jQuery 객체를 리턴한다.

   기본적으로 첫 번째 함수 호출 $ ( 'myDiv')는 각각의 후속 호출은 동일한 하나를 반환하고있는 jQuery 객체를 리턴한다.

   느슨하게,

   var $ = function(selector) {
      return new jQuery(selector);
   };
   
   jQuery.prototype.removeClass = function(className) {
      // magic
      return this;
   }
   

4. ---

   4.

   return $this;
   

   각각의 jQuery 함수가 반환 한 후 호출 방법을 가질 수있는 jQuery를 클래스의 인스턴스. 당신은 그것을 무너 뜨리는 수 있으며,이 코드는 같은 효과를 가질 것이다.

   jQuery_obj = $('myDiv');
   jQuery_obj = jQuery_obj.removeClass('off');
   jQuery_obj = jQuery_obj.addClass('on');
   

5. ---

   5.요점은 함수는 "부모"기능으로 평가해야한다는 것입니다. 그래서 예를 들면,

   요점은 함수는 "부모"기능으로 평가해야한다는 것입니다. 그래서 예를 들면,

   foo().bar().test();
   

   위해 평가한다 :

   foo().test();
   

   당신이 foo는 다른 함수를 호출 할 수 있도록 (). 이렇게하려면, 당신은이를 반환 할 수 있습니다 :

   function foo() {
       // empty, nothing interesting here
   }
   
   foo.prototype.bar = function() {
       return this;
   }
   
   foo.prototype.test = function() {
       return this;
   }
   

   그때,

   var something = new foo();
   something.bar() === something; // true
   

   그리고이 때문에이 :

   something.bar().test() === something.test(); // true
   

   그래서 뭔가 something.bar () 평가되므로, 즉시 한 번에 두 번째 함수를 호출 할 수 있습니다.

6. ---

   6.부모 함수 체인에서 / 메소드는 자식 기능 / 방법으로 사용되는 객체를 반환하고, 일이 같은 방식으로 이동합니다. 짧은에서 jQuery를 또는 $ 반환 자체 (객체)이되는 체인을 할 수 있습니다.

   부모 함수 체인에서 / 메소드는 자식 기능 / 방법으로 사용되는 객체를 반환하고, 일이 같은 방식으로 이동합니다. 짧은에서 jQuery를 또는 $ 반환 자체 (객체)이되는 체인을 할 수 있습니다.

   그것은 아래와 같은 메커니즘

   var obj=$('input');    //returns jQuery object
   var obj1=obj.val('a'); //returns jQuery object
   var obj2=obj1.fadeOut();//returns jQuery object
   

   이 체인으로 수행되는 경우는 다음과 같습니다

   $('input').val('a').fadeOut();
   

7. ---

   7.$ 아약스 jQuery를 함수에 사용되는 것처럼 여기서, 조건부 콜백 체인의 일례이다.

   $ 아약스 jQuery를 함수에 사용되는 것처럼 여기서, 조건부 콜백 체인의 일례이다.

   // conditional callback function example
   myFunction = function () {
   
       // define event callback prototypes without function parameter
       var callback_f = new Object;
       callback_f.callback1 = function () { return callback_f; };
       callback_f.callback2 = function () { return callback_f; };
   
       if ([condition]){
           // redefine the callback with function parameter 
           // so it will run the user code passed in
           callback_f.ReturnPlayer = function (f) { f(); return callback_f; };
       }else{ 
           callback_f.NewPlayer = function (f) { f(); return callback_f; };
       }
   
       return callback_f;
   }
   

8. ---

   8.체인으로가는 길 중 하나는, 데모 확인합니다.

   체인으로가는 길 중 하나는, 데모 확인합니다.

   test("element").f1().f2().f3()
   

9. ---

   9.예

   예

   $(document).ready(function(){
       $('#dvContent').addClass('dummy');
       $('#dvContent').css('color', 'red');
       $('#dvContent').fadeIn('slow');
   });
   

   $(document).ready(function(){
       $('#dvContent').addClass('dummy')
             .css('color', 'red')
             .fadeIn('slow');     
   });
   

10. ---

    10.체인은 우리가 하나의 문장 내에서 (같은 요소에) 여러 jQuery를 방법을 실행할 수 있습니다.

    체인은 우리가 하나의 문장 내에서 (같은 요소에) 여러 jQuery를 방법을 실행할 수 있습니다.

    함께하기 실시 예는 CSS 체인 () slideUp () 및 slideDown () 메소드. 은 "P1"요소 빨간색으로 첫 번째 변화는 다음 위로 슬라이드 한 다음 아래로 슬라이드 :

     $("#p1").css("color", "red").slideUp(2000).slideDown(2000); 
    

from https://stackoverflow.com/questions/7475336/how-does-jquery-chaining-work by cc-by-sa and MIT license