• 实现方式：
    • $.fn.extend(object)
      • 增强通过JQuery获取的对象的功能 $(“#id”)
    • $.extend(object)
      • 增强JQuery对象自身的功能 $/JQuery
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>01-jQuery对象进行方法扩展</title>
  6.     <script type="text/javascript" src="/js/jquery-3.6.0.min.js" type="text/javascript" charset="utf-8"></script>
  7.     <script type="text/javascript">
  8.         //定义jquery的对象插件
  9.         $.fn.extend({
  10.             //定义了一个check()方法 所有的jq对象都可以使用该方法
  11.             check:function () {
  12.                 //让复选框选中
  13.                 //this：调用该方法的jq对象
  14.                 this.prop("checked", true);
  15.             },
  16.             uncheck:function () {
  17.                 //让复选框补选中
  18.                 this.prop("checked",false)
  19.             }
  20.         });
  22.         $(function () {
  23.         //    获取按钮
  24.         //    $("#ben-check").check();
  25.         //    复选框对象.check();
  26.             $("#btn-check").click(function () {
  27.                 $("input[type='checkbox']").check();
  28.             });
  30.             $("#btn-uncheck").click(function () {
  31.                 $("input[type='checkbox']").uncheck();
  32.             });
  33.         })
  34.     </script>
  35. </head>
  36. <body>
  37. <input id="btn-check" type="button" value="点击选中复选框" onclick="checkFn()">
  38. <input id="btn-uncheck" type="button" value="点击取消复选框选中" onclick="uncheckFn()">
  39. <br/>
  40. <input type="checkbox" value="football">足球
  41. <input type="checkbox" value="basketball">篮球
  42. <input type="checkbox" value="volleyball">排球
  44. </body>
  45. </html>
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>01-jQuery对象进行方法扩展</title>
  6.     <script type="text/javascript" src="/js/jquery-3.6.0.min.js" type="text/javascript" charset="utf-8"></script>
  7.     <script type="text/javascript">
  8.         //对全局方法扩展2个方法，扩展min方法：求2个值的最小值；扩展max方法：求2个值最大值
  9.         $.extend({
  10.             max: function (a,b) {
  11.                 return a>=b ? a:b;
  12.             },
  13.             min:function (a,b) {
  14.                 return a<=b ? a:b;
  15.             }
  16.         });
  18.         var max = $.max(3,4);
  19.         alert(max);
  21.         var min = $.min(4,8);
  22.         alert(min);
  24.     </script>
  25. </head>
  26. <body>
  27. </body>
  28. </html>
版权声明：本文为java原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://www.cnblogs.com/ailhy/p/16607602.html