Jquery中對象的寫法問題

jquery(function(){})與(function(){}(jQuery)的區別
jQuery(function(){});
全寫爲
jQuery(docunemt).ready(function(){
});
意義爲在DOM加載完畢後執行ready()方法
2.
funtion(){
}(jQuery);
實際執行()(para)匿名方法,只不過傳遞了jQuery對象。
總結:jQuery(funtion(){});用於存放DOM對象的代碼,執行其中代碼時DOM對象已經存在。
不可用於存放開發插件代碼。因爲jQuery對象沒有得到傳遞,外部通過jQuery.methodye
調用不來其中方法。
funtion(){
}(jQuery);用於存放開發插件的代碼,執行其中代碼DOM不一定存在,直接自動執行DOM操作代碼請小心使用

第二:對於$.extend和$.fn.extend的區別
$.extend(object);爲擴展jQuery類本身.爲類添加新的方法。
$.fn.extend(object);給jQuery對象添加方法。
這二者的區別:一個爲類擴展,一個爲類的實例做擴展!
在放一個便於理解的東西:
jQuery.fn= jQuery.prototype = {
   init: function( selector, context ) {//.... 
   //......
};

$.extend({
hialert:function(e){alert(e);}
})
調用:$.hialert(‘hello alert’);
如果爲類的實例做擴展,那麼您需要這麼寫:
$.fn.extend({
hialert:function(e){alert(e);}
});
調用:$(節點).hialert();===>必須實例化一個類!
下面介紹一個實例:爲一個標籤可以叫做元素節點設置樣式
寫插件之前必須導入jquery庫!
插件
(function($){
$.fn.setFont= function(options){
var data = {
color:"red",
fontSize:"15px",
fontWeight:"normal",
fontFamiay:"微軟雅黑" 
}
var ds = $.extend(data,options);
$(this).css(ds); 
}
})(jQuery);
body體內容
<divid="show">
sssss
</div>
<button id="btn">點擊</button>
調用
$("#btn").click(function(){
$("#show").setFont({color:"blue",fontSize:'30px'});
});

不推薦使用這個做一個元素節點的設置,用內置的$(節點對象).css({})這個方法會更好!

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章