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 ) {//....
//......
};
明白了?哦~原来如此!
我们先来个测试:为jquery类扩展一个方法
$.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'});
});
我就模拟一个jquery插件的写法,不推荐使用这个做一个元素节点的设置,用内置的$(节点对象).css({})这个方法会更好!
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 ) {//....
//......
};
明白了?哦~原来如此!
我们先来个测试:为jquery类扩展一个方法
$.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'});
});
我就模拟一个jquery插件的写法,不推荐使用这个做一个元素节点的设置,用内置的$(节点对象).css({})这个方法会更好!