Shulou(Shulou.com)06/03 Report--

Editor, I would like to share with you $.extend (), $.fn and $.fn.extend () in jquery. I believe most people don't know much about it, so share this article for your reference. I hope you will learn a lot after reading this article. Let's learn about it.

JQuery proposes two methods for developing plug-ins, which are:

JQuery.fn.extend (); jQuery.extend ()

JQuery.fn

JQuery.fn = jQuery.prototype = {init: function (selector, context) {/ / … . / /. }

Originally jQuery.fn = jQuery.prototype. I'm sure I'm no stranger to prototype.

Although javascript does not have a clear concept of a class, it is more convenient to understand it with a class.

JQuery is a very well-encapsulated class. For example, we use the statement $("# btn1") to generate an instance of the jQuery class.

JQuery.extend (object)

Adding class methods to the jQuery class can be understood as adding static methods. Such as:

JQuery.extend ({min: function (a, b) {return a

B? A: B;}}); jQuery.min (2Jing 3); / / 2 jQuery.max (4pm 5); / / 5Objectj Query.extend (target, object1, [objectN])

Extend an object with one or more other objects and return the extended object

Var settings = {validate: false, limit: 5, name: "foo"}; var options = {validate: true, name: "bar"}; jQuery.extend (settings, options); / / result: settings = = {validate: true, limit: 5, name: "bar"} jQuery.fn.extend (object)

To extend jQuery.prototype is to add "member functions" to the jQuery class. Instances of the jQuery class can use this "member function".

For example, we are going to develop a plug-in and make a special edit box that alert the contents of the current edit box when it is clicked. You can do this:

Extend ({alertWhileClick:function () {$(this) .click (function () {alert ($(this). Val ());}}); $("# input1") .alertWhileClick () / / the page is: $("# input1") / / is a jQuery instance. When it calls the member method alertWhileClick, it implements the extension, and each time it is clicked, it will pop up the content in the current edit first.

The call to jQuery.extend () does not extend the method to the instance of the object, and the method referencing it also needs to be implemented through the jQuery class, such as jQuery.init (), while the call to jQuery.fn.extend () extends the method to the object's prototype, so when you instantiate a jQuery object, it has these methods, which is important, which is reflected everywhere in jQuery.js.

JQuery.fn.extend = jQuery.prototype.extend

You can extend an object to jQuery's prototype, which is the plug-in mechanism.

(function ($) {$.fn.tooltip = function (options) {}; / equivalent to var tooltip = {function (options) {}; $.fn.extend (tooltip) = $.prototype.extend (tooltip) = $.fn.tooltip}) (jQuery); these are all the contents of the article "$.extend (), $.fn and $.fn.extend () in jquery, thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.