Conversion between jQuery object and dom object $("#id")[0]

Foreword: I recently encountered $("#id")[0] in the project. At first, I didn't know why [0] was added at the back. Later, Baidu realized that this is for jquery objects and js. When the object is changed, I really didn’t pay attention to these details before I told the truth, and I didn’t know it in my study and work, but I only knew it. This is what I should reflect on in the future. Well, now reprint this article, and friends in need can take a look at it and take it as a note.

Recently, in my spare time, I used jQuery to do a multi-file upload stuff, and by the way, I wrote some notes.

For a long time, the objects obtained by jQuery made it impossible to directly use some methods of JavaScript. At the beginning, I did not understand. Now this case knows that the objects obtained by jQuery are not the same as the objects we usually use getElementById. So some novices are very confused, why ${"#Element"} can't directly innerHTML, this is the reason, please see the solution below.

The conversion between jQuery object and dom object
Only the jQuery object can use the methods defined by jQuery. Note that there is a difference between the dom object and the jquery object. When calling the method, pay attention to whether the dom object or the jquery object is operated.
Ordinary dom objects can generally be converted to jquery objects through $().

Such as:

$(document.getElementById("msg"))

It is a jquery object, you can use the jquery method.
Since the jquery object itself is a collection. Therefore, if the jquery object is to be converted into a dom object, one of the items must be taken out, which can generally be taken out through the index.
Such as:

$("#msg")[0]，$("div").eq(1)[0]，$("div").get()[1]，$("td")[5]

These are all dom objects, you can use the methods in the dom, but you can no longer use the methods of Jquery.
The following spellings are correct:

$("#msg").html();

$("#msg")[0].innerHTML;

$("#msg").eq(0)[0].innerHTML;

$("#msg").get(0).innerHTML;

     Original address: http://www.ccvita.com/192.html