jquery簡單插件制作(fn.extend)完整實例

字號： 小 中 大


    這篇文章主要介紹了jquery簡單插件制作(fn.extend)方法,結(jié)合完整實例形式分析了jQuery fn.extend擴展插件的實現(xiàn)技巧,需要的朋友可以參考下
    本文實例講述了jquery簡單插件制作方法。分享給大家供大家參考，具體如下：
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    <head>
      <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
      <script type="text/javascript" src="jquery.js"></script>
      <title>jquery簡單的插件制作</title>
      <script type="text/javascript">
      (function ( $ ) {
        $.fn.greenify = function ( options) {
          var settings = $.extend({
           color:"#556b2f",
           backgroundColor:'#000',
           padding:'20px'
          }, options );
          return this.css( {
            color:settings.color,
            backgroundColor : settings.backgroundColor,
            padding : settings.padding
          });
        };
      }( jQuery ));
      $(document).ready(function(){
        $("div").greenify({
          color:"#000",
          backgroundColor:'#ccc',
          padding:'50px'
        })
      });
      </script>
    </head>
    <body>
    <div id="accordion">
    jquery簡單的插件制作
    </div>
    </body>
    </html>
    希望本文所述對大家jQuery程序設(shè)計有所幫助。