Differences and conversions between JavaScript objects, DOM objects, and jquery objects

JavaScript provides multiple built-in objects, such as String, Date, and Array.
Objects are only special data types with properties and methods.

Access Object Attributes:

var message="Hello World!";var x=message.length;

Create a JavaScript Object:

person=new Object();person.firstname="Bill";person.lastname="Gates";person.age=56;person.eyecolor="blue";

Use the object constructor:

function person(firstname,lastname,age,eyecolor){this.firstname=firstname;this.lastname=lastname;this.age=age;this.eyecolor=eyecolor;}

var myFather=new person("Bill","Gates",56,"blue");var myMother=new person("Steve","Jobs",48,"green");

Ii. DOM object

DOM is actually a document model described in an object-oriented way. DOM defines the objects required to represent and modify documents, the behavior and attributes of these objects, and the relationship between these objects.

According to W3C DOM specifications, DOM is an application programming interface (API) for HTML and XML ).

With DOM, you can access all HTML elements, along with the text and attributes they contain. You can modify and delete the content and create new elements.
Html dom is independent of platform and programming language. It can be used by any programming languages such as Java, JavaScript, and VBScript.

DOM objects are the objects we obtain using traditional methods (javascript.

III,JQuery object

The jquery object is actually a javascript array.
This array object contains 125 methods and 4 attributes
The four attributes are
Current jquery Framework Version Number of jquery
Length indicates the number of elements in the array object.
Generally, context is directed to the HtmlDocument object.
The content of the selector passed in is as follows: # yourId or. yourClass.

And there is only one element with the id yourId in your page.
Then $ ("# yourId") [0] is the HtmlElement.
It is the same as the element obtained by document. getElementById ("yourId ").

A simple understanding is the object created by jQuery.

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 they cannot use DOM methods.

IV,Differences between DOM objects and jquery objects

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

((“Img”).attr("“src”, ”test.jpg "); // $ (" # img ") here is to get the jQuery object;

Document.getelementbyid(%img%%%.src%%test.jpg "; // The document. getElementById (" img ") Here is the DOM object;

Another example is this. I often write this when writing jQuery:
This.attr(%src%,%test.jpg ");
An error occurs. In fact, this is a DOM object, and
.Attr(“src”, ”test.jpg ")
Is the jQuery method, so an error occurs. To solve this problem, we need to convert the DOM object to the jQuery object, for example:
Certificate (this%.attr(%src%,%test.jpg ");

V,Conversion of DOM objects and jquery objects

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.

Method: $ (DOM object)

Var v = document. getElementById ("v"); // DOM object var $ v =$ (v); // jQuery object

Convert a jQuery object to a DOM object:

Two conversion methods are used to convert a jQuery object to a DOM object: [index] And. get (index );

(1) The jQuery object is a data object. You can use the [index] method to obtain the corresponding DOM object.

Var $ v = $ ("# v"); // jQuery object var v = $ v [0]; // DOM object alert (v. checked) // check whether the checkbox is selected

(2) jQuery provides the. get (index) method to obtain the corresponding DOM object.

Var $ v = $ ("# v"); // jQuery object var v = $ v. get (0); // DOM object alert (v. checked) // check whether the checkbox is selected