jQuery開発プラグインテンプレート

jQueryを使用して、小さなプラグインのテンプレートの書き方を開発します.HTMLコード:

<span id="test">testspan>

JSコード:

<script type="text/javascript">
!function ($) {
     "use strict"; 
     var Plugins =function(element,option){
            this.$element =element;
            this.defaults = {
                "color":"green",
                "fontSize":"16px",
                "fontWeight":"bold"
            }
            this.options = $.extend({}, this.defaults, option)

     }

    Plugins.prototype = {
        changecss:function(){
            return this.$element.css({
                'color':this.options.color,
                'fontSize':this.options.fontSize,
                "fontWeight":this.options.fontWeight
            })
        }
    }
    $.fn.changeCss = function(options){

        var myPlugins = new Plugins(this,options);
        return myPlugins.changecss();
    }
}(window.jQuery);

script>

呼び出し方法:

$("#aaa").changeCss ({
                        "color":"yellow",
                        "fontSize":"20px",
                        "fontWeight":"bold"
                    })