Differences between JQuery objects and DOM objects

JQuery, a beginner, has great doubts about jQuery objects and DOM objects. Therefore, it is necessary to understand the differences and relationships between them.

DOM objects are obtained using the traditional method (javascript). jQuery objects are obtained using the jQuery class library selector. JQuery objects are the objects generated after DOM objects are encapsulated by jQuery. JQuery objects are unique to jQuery. They can use methods in jQuery, but do not use DOM methods;

For example:

$ ("# Color" ).html (); // obtain the html code in the element whose id is color. html () is a unique method of jQuery;
It is equivalent:
Document. getElementById ("color"). innerHTML;

DOM objects are some inherent objects in javascript. DOM objects can use the methods inherent in javascript, but they cannot use the methods in jQuery.

For example, $ ("# id "). innerHTML and $ ("# id "). checked and other statements are incorrect. You can use $ ("# id" ).html () and $ ("# id "). instead of jQuery methods such as attr ("checked.

Var domObj = document. getElementById ("id"); // DOM object
Var $ obj = $ ("# id"); // jQuery object;

Mutual conversion between jQuery objects and DOM objects

Convert a jQuery object to a DOM object

Jquery provides two methods to convert a jquery object into a dom object, that is, [index] And get (index ). Some people may wonder how to use subscript. That's right. The jquery object is an array object.
The following code converts a jquery object to a dom object and then uses the dom object method.

The Code is as follows:

Var $ cr = $ ("# cr"); // jquery object
Var cr = $ cr [0]; // The dom object can also be written as var cr = $ cr. get (0 );
Alert (cr. checked); // checks whether the checkbox is selected.

Convert a dom object to a jquery object
For a dom object, you only need to wrap the dom object with $ () to obtain a jquery object. The method is $ (dom object );
Copy the Code as follows:

Varcr = document. getElementById ("cr"); // dom object
Var $ cr = $ (cr); // convert to jquery object

After conversion, you can use any method in jquery.