Jquery DOM Operations

Common Methods 1. Find ELEMENT Nodesvar $li = $ ("ul li:eq (0)");//Get the first Li under the UL Mark, can also be written as $ ("#ulID li:eq (0)"); 2. Find element PropertiesUsing the attr () method of jquery to get the values of the various attributes of an element, the parameters of the attr () method can be either one or two.         When the parameter is one, it is the name of the property to query.      When the parameter is two, you can set the value of the property. Alert ($ ("#id"). attr ("title")); The title property of the output element. A parameter of $ ("#id"). attr ("title", "Change title value"); Change the value of the title property of an element. Two parameters 3. Adding ELEMENT Nodes$ (HTML) simply explains that the $ (HTML) method creates a DOM object based on the incoming HTML tag string and wraps the DOM object as a jquery object, in short, putting all the markup HTML code into the $ () factory!  Example: var $htmlLi = $ ("<li title= ' banana ' > Banana </li>");   Create Dom object var $ul = $ ("ul"); Get UL object $ul. Append ($htmlLi); Append $htmlli to the Li list of the $ul element below to list some methods for inserting nodes

append ()	append content to each matching element	html code <ul ></ul> jquery code $ ("ul"). Append ("<li>AA</li>"); Results <ul> <li>aa</li> </ul>
appendto ()	This method and append () instead, a.append (b) is b Append to a , while appendto () is b pursues a in	html code Span lang= "en-us" ><ul></ul> jquery code Span lang= "en-US" >$ ("<li>AA</li>"). AppendTo ("ul"); Results <ul> <li>aa</li> </ul>
prepend ()	internal content to each matched element	html code <p haha </p> jquery code $ ("P"). Prepend ("<b>ABC</b>"); Results <p><b>abc</b> haha </p>
prependto ()	the method and prepend () instead, a. Prepend (b) is b forward to a , while prependto () is b pre-placed to a in	html code <p> haha </p> jquery code $ ("<b>ABC</b>"). Prependto. (" P "); Results <p><b>abc</b> haha </p>
after ()	Insert content after each matching element, Yes	html Code <p>aaa</p> jquery code $ ("P"). After ("<b>cc</b>"); Results <p>aaa</p><b>cc</b>
insertafter ()	and after () opposite	html code <p >aaa</p> jquery code $ (" <b>cc</b> "). After ("P"); Results <p>aaa</p><b>cc</b>
before ()	insert content before each matching element	html code <p >aaa</p> jquery code $ ("P") . Before ("<b>cc</b>"); Results <b>cc</b><p>aaa</p>
InsertBefore ()	and before () opposite	HTML Code <p>AAA</p> JQuery Code $ ("<b>cc</b>"). InsertBefore ("P"); Results <b>cc</b><p>AAA</p>

4. Delete ELEMENT nodes    since we need to constantly dynamically change DOM elements, jquery provides two ways to remove nodes, remove () and empty ();     4.1 Remove ( ) method       $ ("P"). Remove ();/    We can get to the element to be deleted and call the Remove () method       $ ("ul li:eq (0)"). Remove (). AppendTo ("ul");//Remove the first Li tag under UL, and then add the deleted Li tag back to the UL, the Remove () method returns a reference to the deleted element, and you can continue to use       $ ("ul Li"). Remove ("li[title!=abc]");//remove can accept parameters to selectively delete eligible elements;    4.2 Empty () method       Strictly speaking, the empty () method is not to delete the element, but to clear the       example:       html Code         <ul>           <li Title= "AAA" >AAA</li>        </ul>       jquery code         $ ("ul li:eq (0)"). Empty ();        Results        <ul>           <li title= "AAA" ></li>        </ul>        Remember that only the content will be emptied and no empty attributes will be requested; 

Jquery DOM Actions