<span style= "font-family:arial, Helvetica, Sans-serif; Background-color:rgb (255, 255, 255); " >1, append and delete HTML elements </span>
Creating HTML Elements
var newele =document.createelement ("P");
The created element is appended to another element:
A. AppendChild (b): If B is a new element, add element B at the end of all child elements of the A element.
If an element already exists in the B page, the effect of this statement is to move the B element into the child element of a.
AppendChild () This function and innerhtml the effect of this property is similar, the difference between: 1 innerHTML the effect will be slower than appendchild (perhaps the reason to parse) 2 innerHTML ratio AppendChild to be more convenient, like writing strings.
There are also two additional elements:
append () and appendto () are functions of jquery. usage modes are:
Append () is preceded by the object to be selected, followed by the element content to be inserted within the object.
AppendTo () is preceded by the content of the element to be inserted and is a jquery object, followed by the object to be selected.
Instance:
$ (' #a '). Append (' content ');
$ (' content '). AppendTo ($ (' #a '));
Note: Append,appendto must be a jquery object in front.
I wrote an example:
<pre name= "Code" class= "JavaScript" ><script type= "Text/javascript" >$ (document). Ready (function () {var t= document.getElementById ("mydiv"); var s=document.createelement ("P"); s.innerhtml= "Woemnsss"; $ (s). AppendTo (t); This sentence can be replaced by two other methods//<span style= "Font-family:arial, Helvetica, Sans-serif;" >t.appendchild (s); </span><pre name= "Code" class= "JavaScript" style= "FONT-SIZE:24PX;" > <span style= "font-family:arial, Helvetica, Sans-serif;" > // $ (t). Append (s);</span>
});</script>
$ (s). AppendTo (t) available <span style= "font-family:arial, Helvetica, Sans-serif;" >t.appendchild (s); and </span><span style= "font-family:arial, Helvetica, Sans-serif;" >$ (t). append (s); Replace, produce the same effect. </span>
<span style= "font-family:arial, Helvetica, Sans-serif;" > In addition: </span><span style= "font-family:arial, Helvetica, Sans-serif;" >$ (s). AppendTo (t) </span><span style= "font-family:arial, Helvetica, Sans-serif;" ></span><pre name= "Code" class= "JavaScript" style= "FONT-SIZE:24PX;" ><pre name= "Code" class= "JavaScript" style= "FONT-SIZE:24PX;" ><span style= "font-family:arial, Helvetica, Sans-serif;" > $ (t). append (s); it can be written in the following ways:</span>
<span style= "font-family:arial, Helvetica, Sans-serif;" > $ (t). Append ($ (s)); <span style= "White-space:pre" ></span>$ (s). AppendTo ($ (t));</span>
<span style= "font-family:arial, Helvetica, Sans-serif;" ></span>
2removeChild()
This function is to get the parent element of the element to be deleted. The grammatical form is: parent.removechild (child);
Sometimes we want to delete without involving the parent element. But Dom is the mechanism, and it must be clear that elements and parent elements can be deleted. When we go to the element to be deleted, we can also delete, using its ParentNode property to find the parent element:
var Child=document.getelementbyid ("P1"); Child.parentNode.removeChild (child);
Note: jquery also has functions that correspond to RemoveChild: Remove () and empty ()
Remove (): Refers to the deletion of both itself and child elements
Empty (): Yes Delete child element
1.javaScript (JS) appendchild and removechild of common functions