Conversion between the need to know jQuery objects and DOM objects

Transition between the object and the DOM object jQuery

jQuery object is an object produced after packaging DOM objects by jQuery.

jQuery objects and DOM object can not call each other methods or properties, but can be switched therebetween.

Both can not use any other method may also have to use (being given)

JQuery convert DOM object to change the object mounted manner:

E.g:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <script src="js/jquery-1.11.3.js" type="text/javascript" charset="utf-8"></script>
        <script type="text/javascript">

        $ ( Function () {
             var divDom = document.getElementById ( " myDiv " ); // this is a DOM object 
            var divjQ = $ (divDom); // convert jQuery object just put $ () 
            the console.log ( divjQ.html ()); // Switch jQuery object in the console output DOM object 
        })
         </ Script > 
    </ head > 
    < body > 
        < div ID = "myDiv" >
            This is the word.
        </div>
    </body>
</html>

Become jQuery object must use jQuery method .html () instead .innerHTML, or will be error

JQuery object to convert DOM objects installed for two kinds of methods are:

The first element in the array of acquisition

 

 

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <script src="js/jquery-1.11.3.js" type="text/javascript" charset="utf-8"></script>
        <script type="text/javascript">

        $ ( Function () {
             // jQuery object is actually an array, where the array contains only one element 
            var divJquery = $ ( " #myDiv " ); // directly to jQuery object,
            
            var divDom = divJquery [ 0 ] // After removing DOM object becomes 
            the console.log (divDom.innerHTML); // Methods DOM can be successfully console output, has been converted to prove 
        })
         </ Script > 
    </ head > 
    < body > 
        < div ID = "myDiv" >
            This is the word.
        </div>
    </body>
</html>

jQuery object is actually an array, where the array contains only one element, the use of [0] jQuery object extraction elements

The second () method to give the corresponding DOM object by .get

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <script src="js/jquery-1.11.3.js" type="text/javascript" charset="utf-8"></script>
        <script type="text/javascript">

        $ ( Function () {
             // jQuery object is actually an array, where the array contains only one element 
            var divJquery = $ ( " #myDiv " ); // Same as above obtained jQuery object 
            var divDom = divJquery.get ( 0 ); // the jQuery itself provides the get () method, to give the corresponding DOM object 
            the console.log (divDom.innerHTML); // DOM method console output 
        })
         </ Script > 
    </ head > 
    < body > 
        < div the above mentioned id = "myDiv" >
            This is the word.
        </div>
    </body>
</html>

Successful conversion of normal output

 

 

 

 If wrong, please correct me: D

Guess you like

Origin www.cnblogs.com/449house/p/11925614.html