Jquery.extend (), jQuery.fn.extend () Extension methods sample detailed _jquery

jquery customizes the Jquery.extend () and JQuery.fn.extend () methods. where the Jquery.extend () method can create global functions or selectors, and jQuery.fn.extend () method to create a JQuery object method.

For example:

Copy Code code as follows:

Jquery.extend ({
Showname:function (name) {
Alert (name)
}
});
Jquery.showname ("Deep Blue");

Jquery.extend () can also be used to extend the jquery object in addition to creating plug-ins.
For example:

Copy Code code as follows:

var a = {
Name: "Blue",
Pass:123
}
var B = {
Name: "Red",
pass:456,
Age:1
}
var c = jquery.extend ({},a,b);

C owns the properties of the A,b object, because the Name property of the B object after the A object takes precedence over the C object.

The Jquery.extend () method passes series options for the plug-in, including default values.

Copy Code code as follows:

function fn (options) {
var options = Jquery.extend ({///default parameter option list
Name1:value1,
Name2:value2,
Name3:value3
},options); Override or Merge to the default parameter options list by using the parameters of a function
function body
}
FN ({name1:value3, name2:value2, name3:value1});//Use new value
FN ({name4:value3, name5:value2});//Add new option by default
FN (); Keep Default option values

When the method is invoked, a new parameter value is passed, and the default parameter option value is overwritten, otherwise the default parameter value is used.

To create a JQuery object method using the Jquery.fn object

You can add properties and methods by Jquery.fn objects, and in fact the Jquery.fn object is hooked up to Jquery.prototype, which jquery has abbreviated.

What is FN? See the jquery code, it's not hard to find.

Copy Code code as follows:

Jquery.fn = Jquery.prototype = {

Init:function (Selector, context) {//....

//......

};

The original Jquery.fn = Jquery.prototype. It's certainly not strange to prototype.

For example:

Copy Code code as follows:

JQuery.fn.test = function () {
Alert ("This is the JQuery object Method!");
}
JQuery ("div"). Click (function () {
$ (this). Test (); invokes the test () method on the current jquery object
});

We can call the JQuery.fn.extend () method to create the JQuery object method.

Copy Code code as follows:

JQuery.fn.extend ({
Test:function () {
Return This.each (function () {
Alert (This.nodename)
});
}
});
JQuery ("Body *"). Click (function () {
$ (this). Test (); Invoke the JQuery object method
});

In one word: Jquery.extend is a custom extension of the jquery class, JQuery.fn.extend is a custom extension of the jquery object.