jQuery 自定义插件（详细步骤）

最新推荐文章于 2024-03-19 19:45:10 发布

卡尔特斯

最新推荐文章于 2024-03-19 19:45:10 发布

阅读量558

点赞数

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

本文链接：https://blog.csdn.net/zz00008888/article/details/109327138

版权

jQuery 专栏收录该内容

19 篇文章 0 订阅

订阅专栏

自定义插件方法
html 中使用：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <script src="jquery-3.4.1.js"></script>
  <script src="jquery-dzm-min.js"></script>
  <script>
    $(function () {
      // 调用自定义插件中的方法
      $('button').on('click', function () {
        $(this).setBgColor('red');
      })
    })
  </script>
</head>
<body>
  <button>按钮1</button>
  <button>按钮2</button>
  <button>按钮3</button>
  <button>按钮4</button>
  <button>按钮5</button>
  <button>按钮6</button>
</body>
</html>

jquery-dzm-min.js :

// 自定义jQuery插件
$.fn.setBgColor = function (color) {
  this.css({'background-color': color});
}

demo 效果:

关注博主即可阅读全文

优惠劵

卡尔特斯

关注关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
打赏
0
评论
jQuery 自定义插件（详细步骤）

自定义插件方法html 中使用：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script src="jquery-3..
复制链接

扫一扫