jQuery练习t314，从0到1

最新推荐文章于 2024-08-17 12:54:01 发布

虾米大王

最新推荐文章于 2024-08-17 12:54:01 发布

阅读量184

点赞数

分类专栏： jQuery JavaScript 文章标签： javascript jquery

本文链接：https://blog.csdn.net/modern358/article/details/113823150

版权

JavaScript 同时被 2 个专栏收录

329 篇文章 0 订阅

订阅专栏

jQuery

296 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="../js/jquery-3.5.1.js"></script>
    <script>
        //jQuery插件
        //定义插件 单参数
        (function () {
           $.fn.extend({
               "changeColor":function (fgcolor, bgcolor) {
                   $(this).mouseover(function () {
                       $(this).css({"color":fgcolor,"background":bgcolor});
                   }).mouseout(function () {
                       $(this).css({"color":"black","background":"white"});
                   });
                   return $(this);
               }
           });
        })(jQuery);

        /*
        jQuery插件可以分为以下3种，
        方法类插件
        函数类插件
        选择器插件

        其中选择器插件，很少有人会去开发使用，因为jQuery内置的选择器
        已经足够完善了。

        方法类插件，我们可以使用$.fn.extend(）方法来定义。
        语法
        (function($){
            $.fn.extend({
                "插件名":function(参数){
                ......
                }
            });
        })(jQuery);

        这里(function(){})()是JavaScript立即执行函数，在高级开发中经常
        使用。


         */
    </script>
    <script>
        $(function () {
           $("h1").changeColor("red","#f1f1f1");
        });
    </script>
</head>
<body>
    <h1>虾米大王</h1>
</body>
</html>

虾米大王

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
jQuery练习t314，从0到1

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="../js/jquery-3.5.1.js"></script> <script> //jQuery插件 //定义插件单参数 .
复制链接

扫一扫