Examples of this and $ (this) difference in jquery _jquery

This is rarely used in jquery at ordinary times. When you look at the code, you find it, and you debug the value of this. It's very useful. Here is a summary of the difference and use of this and $ (this).

What is the $ (this) generated?

What is generated by $ ()? actually $ () =jquery (), which means that the object returned is a jquery.

Usually we use $ () directly for simplicity. In fact, the function omits a parameter context. Select the matching object, i.e. $ (selector, context), to be returned as a jquery wrapper set, based on the selector.

The context can be either a collection of Dom objects or a jquery wrapper set, and the incoming means that you want to select a matching object from within, and not pass in the range of the Document object (that is, all the page objects), that is, $ (selector) =$ (selector,document).

This refers to the HTML object that invokes the function.

Example:

Copy Code code as follows:

$ ("#textbox"). Hover (
function () {
This.title = "Test";
},
Fucntion () {
This.title = "OK";
}
);

Here is actually an HTML element (textbox), this is in JS. The textbox has the Text property, so it's OK to write this.

Copy Code code as follows:

$ ("#textbox"). Hover (
function () {
$ (this). title = "Test";
},
function () {
$ (this). title = "OK";
}
);

The $ (this) is a jquery object, and the jquery object has no title attribute, so it is wrong to write it.

Conclusion:

This indicates that the current context object is an HTML object that can invoke the properties and methods owned by the HTML object.
$ (this), the context object represented is a jquery context object that can invoke jquery's method and property values.

Instance (tab):

Copy Code code as follows:

Tabs ($ ("#nav a"), $ (". Content"));
function tabs (tab, content) {
Content.hide ();
Content.eq (0). Show ();
Tab.click (function () {
var index = Tab.index (this);
Tab.removeclass ("current");
$ (this). AddClass ("current");
Content.hide ();
Content.eq (Index). Animate ({opacity: ' Show '}, 200);
});
}