Ajax has both native and packaged jQuery versions. It feels that jQuery's writing method is simple and clear, and does not need to be compatible with browsers.
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title></title> 6 </head> 7 <body> 8 <input type="button" value="test" /> 9 </body> 10 <script type="text/javascript" src="js/jquery-3.3.1.min.js" ></script> 11 <script type="text/javascript"> 12 $(function(){ 13 $.ajax({ 14 type:"get",//How to submit data 15 url:"",//Submission path 16 async:true//Asynchronous 17 data://data type 18 }); 19 }); 20 </script> 21 </html>
jQuery plug-in is more interesting. It is a more convenient tool to reduce the development project cycle.
A way to customize the jQuery plug-in, which belongs to adding methods to the class to call the object. There is also a class call, similar to a static method,
;(function(){ $.fn.extend({ "color":function(value){ return this.css("background-color",value); } }); })(jQuery);
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <input type="text" /> <input type="button" value="Discoloration" /> </body> <script type="text/javascript" src="js/jquery-3.3.1.min.js" ></script> <script type="text/javascript" src="js/jquery.color.js" ></script> <script type="text/javascript"> $(function(){ $("input[type=button]").click(function(){ $("input[type=text]").color($("input[type=text]").val()); }); }); </script> </html>
In the plug-in, this refers to the jQuery object obtained through the selector, rather than the general method, such as the click() method. The internal this refers to the DOM element.
You can traverse all elements through this.each.