What is a DOM object?
HTML organizes documents in a tree structure as follows:Copy codeThe Code is as follows: <! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<Html xmlns = "http://www.w3.org/1999/xhtml">
<Head>
<Title> 1-4 </title>
<Meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8"/>
<! -- Introduce jQuery -->
<Script src = "../scripts/jquery-1.3.1.js" type = "text/javascript"> </script>
<Script type = "text/javascript">
// Wait until the dom element is loaded.
$ (Document). ready (function (){
Var domObj = document. getElementsByTagName ("h3") [0]; // Dom object
Var $ jQueryObj = $ (domObj); // jQuery object
Alert ("DOM object:" + domObj. innerHTML );
Alert ("jQuery object:" jsonjsonjqueryobj.html ());
});
</Script>
</Head>
<Body>
<H3> example <P title = "select your favorite fruit."> what is your favorite fruit? </P>
<Ul>
<Li> Apple </li>
<Li> orange </li>
<Li> pineapple </li>
</Ul>
</Body>
</Html>
The DOM tree of the preceding HTML file is as follows:
What is a jQuery object?
JQuery objects are DOM objects encapsulated by jQuery, as follows:
$ (DomObj) is equivalent to document. getElementsByTagName ("h3 ")
$ ("# ID") is equivalent to document. getElementsById ("ID ")
Conversion between jQuery objects and DOM objects?
1. Get object:
Get jQuery object: var $ variable = jQuery object;
Get the DOM object: var variable = DOM object;
2. Convert jQuery objects to DOM objects:
Convert var cr = $ ("# cr") [0] Using arrays;
Use the get (index) method to convert var cr = $ ("# cr"). get (0 );
3. convert a DOM object to a jQuery object:
Var cr = document. getElementsById ("cr"); // get the DOM object
Var $ cr = $ (cr); // convert to jQuery object