Jquery element Append and delete __jquery

jquery Add Insert Element tips:

jquery Additions are divided into two kinds of adding and adding outside the specified elements:

Inside add use (Append and prepend)

inside Add and then add in front add and back

Inside the front add use

Append or Appendto

Inside the back Add use

Prepend and Prependto

Outside add use (after and before)

outside Add and then add to the front of the outside add and back

Outside the front add use

Before or InsertBefore

Outside the back add use

After or InsertAfter

Http://www.jb51.net/w3school/jquery/jquery_dom_add.htm

Common Methods 1. Find element Nodevar $li = $ ("ul li:eq (0)")//Get the first Li under the UL Mark, also can write $ ("#ulID li:eq (0)");2. Find element AttributesUsing the attr () method of jquery to get the values of the various attributes of an element, the attr () method can be either one or two arguments.          When the argument is one, it is the name of the property to query.       When the argument is two, you can set the value of the property. Alert ($ ("#id"). attr ("title"); The title property of the output element. A parameter $ ("#id"). attr ("title", "Change the title value"); Change the Title property value of an element. Two parameters3. Adding ELEMENT Nodes$ (HTML) simple explanation the $ (HTML) method creates a DOM object based on the passed-in HTML tag string and wraps the DOM object back into 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 the UL object $ul. Append ($htmlLi); Append the $htmlli to the Li List of the $UL elements list the methods for the partial insertion node

Method	Describe	Example
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 () Attention to the case, I did not pass the test appendto.	In contrast to Append (), A.append (b) appends B to a, while Appendto () pursues B in a	HTML code <ul></ul> jquery Code $ ("<li>AA</li>"). Appendto ("ul").; Results <ul> <li>AA</li> </ul>
Prepend ()	Forward content to each matching element	HTML code <p> haha </p> jquery Code $ ("P"). Prepend ("<b>ABC</b>"); Results <p><b>ABC</b> haha </p>
Prependto ()	In contrast to prepend (), A. Prepend (b) is to place B in front of a, and prependto () is to place B in front of a	HTML code <p> haha </p> jquery Code $ ("<b>ABC</b>"). Prependto. ("P"); Results <p><b>ABC</b> haha </p>
After ()	Inserts the content after each matching element, after which	HTML code <p>AAA</p> jquery Code $ ("P"). After ("<b>cc</b>"); Results <p>AAA</p><b>cc</b>
InsertAfter ()	And after () on the contrary	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 ()	Contrary to the before ()	HTML code <p>AAA</p> jquery Code $ ("<b>cc</b>"). InsertBefore ("P"); Results <b>cc</b><p>AAA</p>

All right, no fasting, try it yourself:4. Delete element node    because we need to constantly change DOM elements dynamically, jquery provides two ways to delete nodes, namely remove () and empty ();     4.1 Remove () method      $ ("P"). Remove ()/    We can get the element to be deleted and call the Remove () method      $ ("ul li:eq (0)"). Remove (). Appendto ("ul");//Remove the first Li Mark below UL, then add the deleted Li Mark to the UL inside, remove () method returns a reference to the deletion element, at which point you can continue to use the      $ ("ul Li"). Remove ("li[title!=abc]");//remove can accept selective deletion of eligible elements through parameters;    4.2 Empty () method      Strictly speaking, the empty () method is not to delete elements, but to empty      cases:      &NBS P HTML code        <ul>           <li title= "AAA" >aaa</li >        </ul>       jquery code        $ ("ul li:eq (0)") . empty ();        Results       <ul>           <li title= "A AA "></li>        </ul>        Remember, will only empty content, not empty attributes;