分享一下編寫設置和獲取顏色的插件，首先我將插件的名字命名為jquery.color.js。該插件用來實現以下兩個功能1.設置元素的顏色。2.獲取元素的顏色。 先在搭建好如下編寫插件的框架： 我這裡採用jQuery.fn.extend().這種方法來編寫，代碼如下： 這個方法可裡面有一個value.參 ...
分享一下編寫設置和獲取顏色的插件，首先我將插件的名字命名為jquery.color.js。該插件用來實現以下兩個功能1.設置元素的顏色。2.獲取元素的顏色。
先在搭建好如下編寫插件的框架：
;(function($){ //這裡編寫插件代碼 })(jQuery);
我這裡採用jQuery.fn.extend().這種方法來編寫，代碼如下：
;(function($){ $.fn.extend({ "color":function(value){ //這裡寫插件代碼 } }); })(jQuery);
這個方法可裡面有一個value.參數，當給color().這個傳入了參數那麼就用來設置color.值，不傳參數就是獲取color().值。代碼如下：
;(function($){ $.fn.extend({ "color":function(value){ if(value==undefined){ return this.css('color'); } else{ return this.css('color',value); } } }); })(jQuery);
最後我們來測試一下：
<body> <script> $(function(){ alert($('#div1').color()); $('#div2').color('#333'); }); </script> <div id="div1" style="color:blue">blue</div> <div id="div2" style="color:#ccc">#ccc</div> </body>
測試結果如下圖:
OK!測試沒問題，全部完成。做這篇分享只是為了分享一下如何實現編寫插件的整個過程
