<! DOCTYPE HTML PUBLIC "-//w3c//dtd HTML 4.01//en" "HTTP://WWW.W3.ORG/TR/HTML4/STRICT.DTD" >
<meta http-equiv= "Content-type" content= "text/html; Charset=utf-8 ">
<title>jquery Insert, copy, replace, and delete nodes </title>
<script type= "Text/javascript" src= "Http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js" ></script >
<script type= "Text/javascript" >
$ (document). Ready (function () {
Several ways to add nodes
$ ("P"). Append ("<b> How are you? </b>);//Add "B" to P element
$ ("<b> how are you? </b> "). AppendTo (" P ");//append" B "to the P element
$ ("P"). Prepend ("<b> How are you? </b>);//forward "B" to P
$ ("<b> how are you? </b> "). Prependto (" P ");//place" B "before the P element
$ ("P"). After ("<b> How are you? </b> ");//insert" B "after P element
$ ("<b> how are you? </b> "). InsertAfter (" P ");//insert" B "behind the P element
$ ("P"). Before ("<b> How are you? </b>);//Add "B" before the P element
$ ("<b> how are you? </b> "). InsertBefore (" P ");//insert" B "in front of P element
Several ways to delete nodes
var $li =$ ("ul li:eq (1)"). Remove ();//delete the 2nd element node in the UL node
$ ("ul"). Append ($li);//Add the newly deleted element node to the UL element
$ ("ul Li"). Remove ("li[title!= pineapple");//Remove the LI element under the title attribute of the UL element not equal to "pineapple"
$ ("ul Li:eq (1)"). empty ();//Empty the contents of the 2nd Li element under the UL node
Replication nodes
/* $ ("ul Li"). Click (function () {
$ (this). Clone (True). AppendTo ("ul");//Copy the currently clicked node and append it to the "ul" element, copying its event when adding a parameter
});
*/
Replace node
$ ("P"). ReplaceWith ("<strong> Your least favorite fruit? </Strong> ");
$ ("[name= ' RP ']"). ReplaceWith ("<tr><td>gg</td><td>gg</td><td>gg</td> <td>gg</td></tr><tr><td>gg</td><td>gg</td><td>gg</td ><td>gg</td></tr> ");
});
</script>
<body>
<p> Hello! </p>
What's your favorite fruit?
<ul>
<li title= "Apple" > Apple </li>
<li title= "Orange" > Orange </li>
<li title= "Pineapple" > Pineapple </li>
</ul>
</body>
jquery Insert, copy, replace, and delete nodes