jQuery 플러그인에서 this.each (function ())을 반환하는 이유는 무엇입니까?
jQuery 플러그인 개발에 대해 본 튜토리얼과 예제 중 일부는
this.each(function () {
//Plugin code here
});
플러그인을 인스턴스화하는 함수의 끝에서 아직 그 뒤에 어떤 추론도 보지 못했지만 모든 사람이 따르는 표준 인 것 같습니다. 누구든지이 관행의이면에있는 추론에 대해 나를 깨달을 수 있습니까?
편집 : 설명을 위해 내 질문은 왜 이것을 반환 해야하는지가 아니라 플러그인이 this.each를 반환 해야하는 이유에 관한 것이 었습니다.
선택기 ( $('.myclass')
)를 사용하여 요소를 필터링하면 둘 이상의 요소와 일치 할 수 있습니다.
를 사용하면 일치하는 모든 요소each
를 반복하고 코드가 모든 요소 에 적용됩니다.
jQuery는 "체인 가능한 메소드"를 지원하므로 대부분의 jQuery 함수는 this
. .each()
를 반환하고 this
, $('selector').yourPlugin().css(...)
일하고 싶다면 return this
.
질문을 명확히 할 수있는 두 개의 "동등한"코드를 보여 드리겠습니다.
jQuery "각"기능 :
(function($) {
$.fn.mangle = function(options) {
return this.each(function() {
$(this).append(' - ' + $(this).data('x'));
});
};
})(jQuery);
jQuery "각"기능없이 :
(function($) {
$.fn.mangle = function(options) {
var objs = this;
for (var i=0; i<objs.length; i++) {
var obj = objs[i];
$(obj).append(' - ' + $(obj).data('x'));
};
return this;
};
})(jQuery);
그래서, 기본적으로, each
함수는 모든 요소에 일부 코드에 포함 된 적용하는 데 사용됩니다 this
(객체 로 this
일반적으로 jQuery를 선택에 의해 반환 된 요소의 그룹을 의미 )과에 대한 참조를 반환 this
( 같은 each
기능이 항상 calls- 체인 수있는 아키텍처에 많은 투자를 그 참조를 반환 )
보조 노트로 (두 번째 방법 : - for
루프 인 ) 빠른 (특히 오래된 브라우저에서)는 이전보다 ( - each
기능 - ).
플러그인을 작성할 때 jQuery 객체를 확장하고 jQuery 객체는 시퀀스 this.each(function () { });
이므로 시퀀스의 각 항목에 대해 플러그인이 실행되도록 반환 합니다.
간단히 말해서 지금까지 수행 된 모든 것을 반환하므로 다음 항목 .anyMethod()
이 변경 / 수정 된 요소에 대해 작동 할 수 있으므로 체인을 활용할 수 있습니다.
또한이 링크를 살펴보면 jQuery 플러그인 개발에 대한 많은 정보를 얻을 수 있습니다.
http://www.webresourcesdepot.com/jquery-plugin-development-10-tutorials-to-get-started/
http://www.learningjquery.com/2007/10/a-plugin-development-pattern
http : / /snook.ca/archives/javascript/jquery_plugin
여기에 jQuery 플러그인을 바로 시작할 수있는 멋진 웹 기반 앱이 있습니다. http://starter.pixelgraphics.us/
참고 URL : https://stackoverflow.com/questions/2678185/why-return-this-eachfunction-in-jquery-plugins
'IT TIP' 카테고리의 다른 글
ASP.NET 라우팅을 사용하여 정적 파일 제공 (0) | 2020.10.29 |
---|---|
명시 적 인스턴스화-언제 사용됩니까? (0) | 2020.10.29 |
setup.py 예? (0) | 2020.10.29 |
AngularJS를 사용하여 동적 정의 목록을 어떻게 렌더링합니까? (0) | 2020.10.29 |
JPA 엔티티 관리자를 닫아야합니까? (0) | 2020.10.29 |