jquery 플러그인 학습(5)_jquery

이 섹션에는 플러그인이 요약되어 있습니다. 진행 상황은 어떻습니까?

일반적으로 외부에 출시되는 플러그인은 캡슐화되어야 하며, 캡슐화된 플러그인도 사양을 준수해야 합니다. 이렇게 작성된 플러그인만이 홍보 가치를 가지며 다른 사람들에게 사랑받을 수 있습니다. 사용자.

첫 번째 단계는 독립 도메인을 정의하는 것입니다. 코드는 다음과 같습니다.

코드 복사 코드는 다음과 같습니다.

(함수($){
//플러그인 코드 정의
}) (jQuery) //플러그인 캡슐화

생성할 플러그인 종류를 결정하고 생성 방법을 선택합니다. 요소의 글꼴 색상을 설정하는 플러그인을 생성하려면 jquery 객체 메소드를 생성해야 합니다. jquery가 플러그인 확장 메소드인 extend()를 제공한다는 점을 고려하면 이 메소드를 호출하는 것이 더 표준화될 것입니다.

코드 복사 코드는 다음과 같습니다.

(함수($){
//플러그인 코드 정의
$.extend($.fn,{ //jquery 객체 확장 메서드

})
})(jQuery) //플러그인 캡슐화

일반적으로 플러그인은 플러그인의 동작을 제어하기 위해 매개변수를 허용합니다. 예를 들어 색상을 설정하는 플러그인의 경우 동시에 글꼴 색상도 설정할 수 있어야 합니다. 이때, 사용자가 색상을 설정하지 않으면 기본 색상이 유지되어야 한다는 점을 고려해야 한다.

코드 복사 코드는 다음과 같습니다.

(함수($){
//플러그인 코드 정의 이후
$.extend($.fn,{
color : function(options){
var options = $.extend({bcolor : "white",fcolor: " black"},options ; 🎜>
코드 복사


코드는 다음과 같습니다.

;(function($){
$.extend ($.fn,{

color : function(options){var options = $.extend({bcolor :"white",fcolor :"black"},options); //함수 본문 return this.each(function(){ $(this).css("color",options.bcolor); $(this).css("Background",options.fcolor); }); }// color==end

})

})(jQuery)


전화해서 보세요




코드 복사


코드는 다음과 같습니다.

$("h1").color({bcolor : "#ccc",fcolor:" #eee"});
$(' a').color("#fff");