标签:style blog color java 使用 io strong ar
Jquery扩展插件有三大法宝,
1、封装对象方法 (本文详细介绍):对通过选择器获取的jQuery对象进行操作。
2、封装全局函数
3、选择器插件
jQuery插件的机制:
jQuery插件的机制很简单,就是利用jQuery提供的jQuery.fn.extend()和jQuery.extend()方法,扩展jQuery的功能。
jQuery.fn.extend()多用于扩展上面提到的3种类型中的第一种,jQuery.extend()用于扩展后两种插件。
废话不多说,自己编写的插件建议命名为jquery.xxxx.js
本文JQuery库使用的版本是1.10.2
jquery.code.js
1 (function ($) { 2 $.fn.code = function (options) { 3 var defaultVal = { 4 color:‘blue‘ 5 }; 6 var obj=$.extend(defaultVal,options); 7 return this.each(function(){ 8 var selObject = $(this); 9 selObject.css(‘color‘,obj.color); 10 }); 11 }; 12 })(jQuery);
code.html
1 <!doctype html> 2 <html> 3 <head> 4 <script src="/js/jquery.js" type="text/javascript"></script> 5 <script src="/js/jquery.code.js" type="text/javascript"></script> 6 <script> 7 $(document).ready(function(){ 8 $(".mark").code({ 9 color:‘orange‘ 10 }).fadeOut(‘slow‘); 11 }); 12 </script> 13 </head> 14 <body> 15 <span class="mark">Hello World!</span> 16 <span class="mark">Hello University!</span> 17 </body> 18 </html>
发挥想象力之后,别忘记载入你自己写的js,其他的不解释。
JQuery插件编写之封装对象,布布扣,bubuko.com
标签:style blog color java 使用 io strong ar
原文地址:http://www.cnblogs.com/angular/p/3898282.html