Detailed explanation of converting jQuery objects and DOM objects to and from each other

Before talking about the conversion between them, let’s talk about the relationship between them:

Js is a dynamic weakly typed language, which is JavaScript The abbreviation of jQuery is an encapsulation and extension of js. jQuery is a framework encapsulated by js, which makes

jquery more convenient and concise. For example, js is like raw noodles, while jquery is instant noodles. You can eat them after soaking them, which is more convenient.

That is: jquery uses the least code to complete more functions. The above is my understanding of the difference between js and jquery.

For example: $("#img").attr("src","test.jpg"); where $("#img") is the jQuery object;

            document.getElementById("img").src = "test.jpg"; document.getElementById("img") here is the DOM object.

1. Convert DOM object into jQuery object

For a DOM object that is already a DOM object, just use $() to wrap the DOM object , you can get a jQuery object, $(DOM object) Note: var is a defined variable

such as: 　

var v = document.getElementById("v"); //DOM对象
var $v = $(v); //jQuery 对象

After conversion, you can use jQuery methods at will.

2. Convert jQuery object to DOM object

Two conversion methods talk about converting a jQuery object into a DOM object: [index] and .get(index);

(1) The jQuery object is a data object, and the corresponding DOM object can be obtained through the [index] method.

For example:

var $v = $("#v"); //jQuery 对象
var v = $v[0]; //DOM 对象
alert(v.checked); //检测这个checkbox是否被选中

(2) jQuery itself provides the corresponding DOM object through the .get(index) method

For example:

var $v = $("#v"); //jQuery 对象
var v = $v.get(0); //DOM对象 ( $v.get()[0] 也可以 )
alert(v.checked); //检测这个 checkbox 是否被选中

Pass The above methods can arbitrarily convert jQuery objects and DOM objects to each other. What needs to be emphasized again is: only DOM objects can use methods in DOM, and jQuery objects cannot use methods in DOM.

The above is the detailed content of Detailed explanation of converting jQuery objects and DOM objects to and from each other. For more information, please follow other related articles on the PHP Chinese website!