Jquery 插件 $ & $.fn
jQuery.extend(object);为扩展jQuery类本身.为类添加新的方法。
jQuery.fn.extend(object);给jQuery对象添加方法。
<div id="myDiv"></div>
(function($){
$.fn.extend({
test:function(){
alert($(this).attr('id'));
}
})
})(jQuery)
$('#myDiv').test();
打印出 : myDiv
(function($){
$.extend({
test:function(){
alert('111');
}
})
})(jQuery)
$.test();
打印出:111
前者是绑定在页面元素上的插件,后者是 绑定在jquery上的插件。
EG:
<html>
<body>
<h3 class="ye">new soul</h3>
<h3 class="ye">new soul</h3>
<h3 class="ye">new soul</h3>
<h3 class="ye">new soul</h3>
<script type="text/javascript" src="js/jquery-1.8.2.min.js" charset="gb2312"></script>
<script type="text/javascript">
$.fn.myPlugin = function(dewdwd) {
_options = $.extend({
html: "nothing",
css: {
"color": "red",
"fontSize":"12px",
}
},dewdwd);
return $(this).css({color: _options.css.color,fontSize: _options.css.fontSize}).html(_options.html);
}
$('.ye').myPlugin({html:"So easy,阿桑地方?",css:{color:"green",fontSize:"20px"}});
</script>
</body>
</html>
EEGG:TAB 3d