Explanation of mutual conversion between jquery objects and DOM objects, jquerydom
Mutual conversion between jquery objects and DOM objects
Before discussing the mutual conversion between jquery objects and DOM objects, we must first define the style of variables. If jquery objects are obtained, add $ before the variables. For example:
Var $ varible = jquery object;
If a DOM object is obtained, it is defined as follows:
Var varible = DOM object;
1. convert a jquery object to a DOM object:
Jquery objects cannot use methods in the DOM. However, if they are unfamiliar with the methods provided by jquery objects or do not have methods to be encapsulated by jquery, they must use DOM objects, that is, [index] And get [index].
(1) The jquery object is an array object. You can use the [index] method to obtain the corresponding DOM object.
The jquery code is as follows:
<Body> <p> my </p> <script src = "jquery-2.1.4.min.js"> </script> <script> var $ cr = $ ("p "); // jquery object var cr = $ cr [1]; // dom object var ct = $ cr. get (0) // second method of converting to DOM object cr. innerHTML = "you" // check whether the conversion is successful. you can use the DOM method to output the second result. innerHTML = 'fuck' // The first output result is changed to fuck. </script> </body>
(2). 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 ).
The jquery code is as follows:
<Body> <p> my </p> <script src = "jquery-2.1.4.min.js"> </script> <script> var cr = document. getElementsByTagName ("p") // DOM object var $ cr = $ (cr); // jquery object $ cr. eq (0 ). ("fuck"); // check whether the conversion is successful. you can use the jquery method to output the second result, which is changed to fuck javascr.eq(1).html ("you "); // change the output result to my. </script> </body>
After conversion, you can use the jquery method at will.
By using the above method, you can convert jquery objects and DOM object webpage effects to each other.
Finally, we emphasize that only DOM objects can use the DOM method. jquery objects cannot use the methods in DOM, but jquery objects provide a more comprehensive set of tools for DOM operations.
Thank you for reading this article. I hope it will help you. Thank you for your support for this site!
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
