jquery插件开发学习笔记（一）

写在前面

看到很多用jquery写的各种小插件，很感兴趣，尝试自己写一个。这是根据网上的资料做的一个具有传递参数的一个具备了基本功能的插件。

---

引入jquery

<script src="../lib/jquery/jquery.js"></script>

定义插件

$.fn.myPlugin=function(){

};

使用插件

$("p").myPlugin();//p标签使用插件

插件代码

this.css("color","red");

这行代码就可以实现改变字体颜色：$("p").plugin();

传入参数

 $.fn.myPlugin=function (options) {
            var defaults={
                color:"red",
                backgroundColor:"#aaa",
                fontSize:"20px"
            };

            var settings=$.extend({},defaults,options);

            return this.each(function () {
                if($(this).attr("href")){
                    $(this).append("   :  "+$(this).attr("href"));
                }
            }).css({
                "color":settings.color,
                "background-color":settings.backgroundColor,
                "font-size":settings.fontSize
            });

        };

options 是插件被调用时用户传入的参数，而defaults是开发者定义的默认参数，在参数真正使用之前，用extend函数将它们合并：如果用户传入了参数，就将它们和defaults合并，否则，使用默认值。而｛｝作为一个空值，是为了存储合并结果，以免默认参数被污染。

插件打包

(function($){
    //code goes here
})(jQuery);