jquery Learning Note 1

$ (function () {}) is a shorthand for Ready (function () {}), which executes a series of pre-defined functions after the DOM loading is complete.

(function () {}) (); This can be understood as a closure is a call to an anonymous method to ensure that the variables inside the method do not conflict with the outside world, immediately execute the function, the equivalent of declaring a function, after the declaration of a direct call;

(function ($) {...}) (jQuery);
Equivalent to the following wording:
var fun = function (params) {...};
Fun (jQuery);

If the parameters are as follows:
(Funtion (str) {alert (str)}) ("Output")) ; equivalent: funtion outputfun (str) {alert (str);};o Utputfun ("Output");

(Funtion (str) {alert (str)}) ("Output")) ; equivalent: funtion outputfun (str) {alert (str);};o Utputfun ("Output");

JQuery (function () {}), which holds the code for manipulating the DOM object, and the DOM object already exists when the code executes it. cannot be used to store code that develops plug-ins, because jquery objects are not passed, and external methods (functions) cannot be called by Jquery.method.
(function () {}) (JQuery), which is used to store the code that develops the plug-in, and the DOM does not necessarily exist when executing the code, so be careful with the code that automatically executes DOM operations directly.

JQuery.fn.extend () function explanation

jQuery.fn.extend()function is used to extend one or more instance properties and methods for jquery (primarily for extension methods).

jQuery.fnis a prototype object of jquery, and its extend() methods are used to add new properties and methods to the prototype of jquery. These methods can be called on the jquery instance object.

The jQuery prototype object (JQUERY.FN) that the function belongs to.

Name:<input Id="Name" Name="Name" Type="Text" >
<br>
<input Name="Opt" Type="checkbox" Value=A>A
<input Name="Opt" Type="checkbox" Value=B>B
<input Name="Opt" Type="checkbox" Value= "C" >c 
 <input  name= "opt" type= "checkbox"  value = "D" >d 
 <br > 
 <input id=  "btn"  type= "button" Span class= "PLN" > value= "click" >    

jQuery.fn.extend()The jquery sample code for the function is as follows:

VarObj= {
Site: "Codeplayer",
Check: function(){
After extending to the jquery prototype, this here represents the current jquery object
This.Prop("Checked", True);
Return This;
},
IsEmpty: function(){
 Return !$.Trim( This.Val() );
}
};

Extends the properties and methods of object obj to the prototype object of jquery for easy invocation by the jquery instance object.
$.Fn.Extend(Obj);


$("#btn").Click(function(){
If($("#name").IsEmpty() ){
Alert( "name cannot be empty!"  
         return ; 
     } 
     $ ( "[ Name=opt] "). check ( //Select all check box  
     
     Alert ( $ ( "body" );  //codeplayer 
 });      

In fact, if you can add a new property or method to the jquery prototype yourself, for example, the extension code above is equivalent to:

$.Fn.Site= "Codeplayer";

$.Fn.Check= function(){
After extending to the jquery prototype, this here represents the current jquery object
This.Prop("Checked", True);
return this ;
};

$. fn.  IsEmpty = function() {
return !  $. Trim(this .  Val() );
}; 

Extend: Extend, stretch, enlarge

The following transfers are from: http://www.caihaibo.cn/devpro/webfront/3077.html

Although JavaScript does not have a clear concept of classes, we see Jquery as a class that is better understood.

Jquery provides two methods for developing plug-ins: Jquery.extend () and Jquery.fn.extend ().

Can be understood as a Jquery class to add static methods, the extension method prototype is:

jquery Learning Note 1