Li moves the second form of
The AppendChild () method adds a new child node to the end of the node's child nodes list.
tip: If newchild already exists in the document tree, it will be removed from the document tree and then reinserted into its new location. If Newchild is a documentfragment node, it is not inserted directly, but its child nodes are inserted sequentially at the end of the childnodes[] array of the current node.
You can use the AppendChild () method to remove an element to another element.
1 <!DOCTYPE HTML>2 <HTML>3 <Head>4 <MetaCharSet= "UTF-8">5 <title></title>6 <styletype= "Text/css">7 #ul1{background:Green;}8 #ul2{background:Yellow;}9 </style>Ten </Head> One <Body> A <ulID= "UL1"> - <Li>1</Li> - <Li>2</Li> the <Li>3</Li> - <Li>4</Li> - </ul> - + <inputtype= "button"name=""ID= "BTN1"value= "Move" /> - + <ulID= "Ul2"> A </ul> at </Body> - <Scripttype= "Text/javascript"> - window.onload= function(){ - varOUL1=document.getElementById ("UL1"); - varOUl2=document.getElementById ("UL2"); - varobtn=document.getElementById ("BTN1"); in - Obtn.onclick= function(){ to //first find the element in motion (node) + varOLi=Oul1.firstelementchild; - //Console.log (oLi); the //var oLi = oul1.children[0]; * $ //Delete in Ul1Panax Notoginseng //Oul1.removechild (oLi); - //Add in Ul2 the Oul2.appendchild (oLi); + //1. Remove the element from its original parent element first A //2. Add to new parent element the } + - $ } $ </Script> - - </HTML>
06-li the second form of movement