Fork me on GitHub

js插件开发

https://www.cnblogs.com/st-leslie/p/5154276.html

 我的demo

<body>
    <div class="default">默认的样式</div>
    <div class="default">默认的样式</div>
    <div class="default">默认的样式</div>
    <div class="change">修改后的样式</div>
</body>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="old.js"></script>
<script type="text/javascript">
$(function(){
    var opt = {
        'font-size':"20px"
    }
    $(".default").highLight(opt);
    var t = $(".default").showOptions();
    console.log(t);
})
</script>
(function ($) {
    var defaults = {
        foreground: 'red',
        background: 'yellow'
    }
    var cal = null;
    var Cal=function(ele,opt){
        this.element=ele;
        this.options=$.extend({},defaults,opt);
    }
    //定义对象的方法
    Cal.prototype = {
        init:function() {
            var that = this.options;
            this.element.each(function () {  
                $(this).css({
                    backgroundColor: that.background,
                    color: that.foreground
                });
            });
         },
         getDate:function(){
            return this.options
         }
    };
    $.fn.extend({
        "highLight": function (options) {
            cal=new Cal(this,options);
            cal.init();
        },
        "showOptions":function(){
            console.log(cal.options)
            return cal.getDate();
        }
    });
    
})(jQuery);

 

posted @ 2018-09-27 17:35  森海轮回  阅读(806)  评论(0编辑  收藏  举报