Jquery 중(function ($)(jQuery),$(function(){}),

6109 단어 jquery
1.(function($){...})(jQuery)、(function(arg){})(param)、(function(){})()、$(document).ready(function(){...})------함수의 자체 실행은 모두 익명 함수입니다.function ($) {...}매개 변수는 $, function (arg) {...}매개변수는 arg이고 function() {...}무참.익명 함수를 호출할 때 함수 뒤에 괄호와 실참이 있습니다. 조작부호의 우선순위 때문에 함수 자체도 괄호를 사용해야 합니다. (함수 자체 실행에 해당하는 익명 함수를 정의한 다음에 이 함수를 호출합니다. 이 함수의 실참은 jQuery) (function ($) {...})(jQuery)(형삼에서 $를 사용하는 것은 다른 라이브러리와 충돌하지 않기 위해 실제 jQuery를 사용하는 것이다) 사실은 var fn = function($) {......}와 같다.fn (jQuery), 주의: fn은 존재하지 않습니다. 그 함수는 직접 정의된 다음에 실행됩니다.(function($){...})(jQuery) 역할: 미리 정의해야 할 함수를 정의하는 데 사용됩니다. 이 익명 함수 쓰기의 가장 큰 장점은 클립을 형성하는 것입니다. (function ($) {...} (jQuery) 내부에서 정의된 함수와 변수는 이 범위 내에서만 유효합니다.2.$(function(){…}); jQuery(function($) {…}); $(document).ready (function () {...} -------DOM 대상이 불러온 후에 실행하는 역할은 모두 같습니다. DOM 불러온 후에 미리 정의된 함수를 실행\실행하는 데 사용됩니다.요약: $(function () {}) 는 DOM 대상을 실행하는 코드를 저장하는 데 사용되며, 이 코드를 실행할 때 DOM 대상이 이미 존재합니다.개발 플러그인의 코드를 저장하는 데 사용할 수 없습니다. jQuery 대상이 전달되지 않았기 때문에 외부는 jQuery를 통과합니다.method도 그 중의 방법 (함수) 을 호출할 수 없습니다.(function($){ })(jQuery);개발 플러그인을 저장하는 데 사용되는 코드입니다. 그 중 코드를 실행할 때 DOM이 반드시 존재하지 않기 때문에 DOM 동작을 직접 자동으로 실행하는 코드는 조심스럽게 사용하십시오.3. jQuery는 플러그인 개발에 두 가지 방법을 제공했다. $.fn.extend(object) 및 $.extend(object):3.1 $.extend(object):$.xxx=function(options) {} jQuery 클래스에 방법 xxx를 추가하는 데 $.extend(object)는 jQeury 클래스에 여러 가지 방법을 추가하는 데 사용됩니다. 효과는 모두 같습니다. jQuery 클래스 자체를 확장하기 위해서입니다. 이 클래스에 새로운 방법(정적 방법)을 추가하기 위해서입니다. jQuery 자체를 사용하면 이 방법을 호출할 수 있습니다. jQuery 클래스에 추가하는 방법은 모두 전역 함수입니다.예를 들어://jquery에 여러 방법을 추가합니다 $.extend({  add:function(a,b){return a+b;}, minus:function(a,b){return a-b;} }); $.add(3,4);//7 $.minus(5,2)//3
//Jquery에 메서드 추가$.getData = function (options) { var opts = $.extend(true, {}, $.fn.loadMore.defaults, options); $.ajax({ url: opts.url, type: "POST", contentType: "application/json; charset=utf-8", dataType: "json", data: "{groupNumber:"+ opts.groupNumber + "}", success: function (data, textStatus, xhr) { if (data.d) {//We need to convert JSON string to object, then//iterate thru the JSON object array. $.each($.parseJSON(data.d), function () { $("#result").append('' + this.Id + ' - ' + '' + this.Name + '' + ' — ' + '' + this.Comment + ' '); }); $('.animation_image').hide(); options.groupNumber++; options.loading = false; } }, error: function (xmlHttpRequest, textStatus, errorThrown) { options.loading = true; console.log(errorThrown.toString()); } });
                      :   jQuery     ,      javascript       ,                    jQuery    ,                         :

            $.myPlugin={  
foo:function(){alert('This is a test')},  
bar:function(){alert('This is another test')}  

} $.myPlugin.foo(); $.myPlugin.bar(); $.extend 함수는 jQuery 클래스에 새로운 방법을 추가하는 것 외에 두 개의 재부팅 원형이 있습니다: 1) Jquery의 확장 방법 원형: $.extend(dest,src1,src2,src3...);src1, src2, src3...dest에 합병되면 반환값은 합병된 dest로 이 방법이 합병된 후에 dest의 구조를 수정한 것을 알 수 있다.병합된 결과를 얻으려면dest의 구조를 수정하지 않으려면 다음과 같이 사용할 수 있습니다: var newSrc=$.extend({},src1,src2,src3...)//즉 "{}"을dest 매개 변수로 사용하면 src1,src2,src3...병합을 진행한 다음 병합 결과를 newSrc에 되돌려줍니다. eg: var result=$.extend({}, {name: "Tom",age:21}, {name: "Jerry", sex: "Boy"}), 병합 후 결과:result={name: "Jerry",age:21,sex: "Boy"}, 즉 뒤의 매개 변수가 앞의 매개 변수와 같은 이름이 존재하면 뒤의 매개 변수가 앞의 매개 변수를 덮어씁니다.
2)$.extend(boolean,dest,src1,src2,src3...)또는 $.extend(boolean,{},src1,src2,src3...):작용도 src1, src2, src3...dest에 합치면 반환 값이 합쳐진 dest이고 첫 번째 파라미터는 깊이 귀속 합병을 하는지 여부를 나타낸다. 즉, 첫 번째 파라미터가true이고 여러 대상의 같은 이름의 속성도 대상이면 이'속성 대상'의 속성도 합쳐진다(뒤에 앞의 같은 속성의 값을 덮어쓴다). 만약에 첫 번째 파라미터가false라면또한 여러 개의 대상의 같은 이름의 속성도 모두 대상입니다. 마지막 같은 이름의 속성의 값만 가져옵니다. 예를 들어 var result=$.extend( true, {}, { name: "John", location: {city: "Boston",county:"USA"} }, { last: "Resig", location: {state: "MA",county:"China"} } ); 결과:result={name: "John",last: "Resig",location: {city: "Boston",state: "MA",county: "China"}}var result=$.extend( false, {}, { name: "John", location:{city: "Boston",county:"USA"} }, { last: "Resig", location: {state: "MA",county:"China"} }); 결과는:result={name: "John",last: "Resig",location: {state: "MA",county: "China"}
4.$.fn.extend(object) :$.fn = jQuery.prototype$.fn.xxx는 단일 방법 xxx를 추가하는 데 사용되며 $.fn.extend는 여러 가지 방법을 추가하는 데 사용되며, 효과는 모두 같다.jQuery 대상에 방법을 추가하고 jQuery 대상을 확장합니다. 즉, jQuery 클래스에 '구성원 함수' 를 추가합니다. jQuery 클래스의 실례 대상만 '구성원 함수' 를 호출할 수 있습니다. 예를 들어 $.fn.extend({ alertWhileClick: function () { $(this).click(function() { alert($(this).val()) }) },putblur: function() {$(this).blur(function() {alert($(this).val()})})/$("#input1〃).alertWhileClick();$("#input1〃).inputblur();/$("#input1〃)는 구성원 방법으로 조정하면 현재 편집된 내용이 팝업될 때마다 팝업됩니다.
                       :
            //         

(function($) {//플러그인의 정의 $.fn.hilight = function(options) {//build main options before element iteration var opts = $.extend({}, $.fn.hilight.defaults.options);//iteration and reformar each matched element return this.each(function(){ $this = $(this);//build element specific options var o = $.meta ? $.extend({}, opts, $this.data()) : opts; $this.css({ backgroundColor: o.background, color: o.foreground }); var markup = $this.html();//call our format function markup = $.fn.hilight.format(markup); $this.html(markup); }); };//개인 함수: debugging function debug ($obj) {if (window.console & & window.console.log) window.console.log ('hilight selection count: '+ $obj.size ());//노출format 함수 정의 $.fn.hilight.format = function(txt) { return '' + txt + ''; };//플러그인의defaults$.fn.hilight.defaults = { foreground: 'red', background: 'yellow' }; }) }//닫기 끝} (jQuery);//플러그인 사용: $.fn.hilight.defaults.foreground = "blue"; $("myDiv").hilight();
};  

좋은 웹페이지 즐겨찾기