为元素扩展新方法

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7.     <title>Document</title>
  8.     <script src="../jquery-3.3.1.min.js"></script>
  9. </head>
  10. <body>
  11.     <div id="box">
  12.         JQ方法
  13.     </div>
  14. </body>
  15. <script>
  16.     $.fn.extends({
  17.         colors:function(color){
  18.             this.css('background',color);
  19.         }
  20.     });
  21.     $('#box').colors('red');
  22. </script>
  23. </html>

为元素扩展新方法；
语法 $.fn.extend（obj）
obj：key 方法名，value 处理程序，实现的效果

  1. <!DOCTYPE html>
  2. <html lang="en">
  3.   <head>
  4.     <meta charset="UTF-8">
  5.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7.     <title>Document</title>
  8.     <script src="../jquery-3.3.1.min.js"></script>
  9.   </head>
  10.   <body>
  11.     <div id="box">
  12.       JQ方法
  13.     </div>
  14.   </body>
  15.   <script>
  16.     $.fn.extends({
  17.       colors:function(color){
  18.         this.css('background',color);
  19.       }
  20.     });
  21.     $('#box').colors('red');
  23.     $.extend({
  24.       min:function(a,b){
  25.         return a<b?a:b;
  26.       }
  27.     });
  28.     alert($.min(1,4))
  31.   </script>
  32. </html>

image.png
image.png
image.png

each方法

image.png
image.png