Convert jQuery objects and DOM objects to each other_jquery

DOM objects are some object operations inherent in Javascript. DOM objects can use methods inherent in Javascript, but cannot use methods in jQuery. For example: document.getElementById("img").src="test.jpg"; document.getElementById("img") here is the DOM object;
$("#img").attr("src", "test.jpg"); and document.getElementById("img").src="test.jpg"; are equivalent and correct, but $("#img").src ="test.jpg"; or document.getElementById("img").attr("src","test.jpg"); are both wrong.

Let’s talk about an example: this is this. When I write jQuery, I often write like this: this.attr("src","test.jpg"); But it’s an error. In fact, this is a DOM object, and .attr("src","test.jpg") is a jQuery method, so something went wrong. To solve this problem, you need to convert the DOM object into a jQuery object, such as $(this).attr("src","test.jpg");

1. Convert DOM object to jQuery object:

For a DOM object, you only need to wrap the DOM object with $() to get a jQuery object. $(DOM object)

For example: var v=document.getElementById("v"); //DOM object

var $v=$(v); //jQuery object

After conversion, you can use jQuery methods at will.

2. Convert jQuery object to DOM object:

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

(1) The jQuery object is a data object, which can be used through the [index] method, to get the corresponding DOM object.

For example: var $v =$("#v"); //jQuery object

var v=$v[0]; //DOM object

alert (v.checked) //Detect whether this checkbox is selected

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

is obtained, such as: var $v =$("#v"); //jQuery object

var v=$v.get(0); //DOM object

alert(v.checked) //Detect this Whether the checkbox is selected