Home > Developer > Web Develop
<!DOCTYPE HTML><HTML><Head><title>Node Add and remove exercises</title><Metahttp-equiv= "Content-type"content= "text/html; charset=utf-8"><styletype= "Text/css">Div{text-align:Center;Background-color:#c0c0c0;width:65%;Height:65%;}</style><Scripttype= "Text/javascript"> //Requirements: Dynamically adds information to the table and can deletewindow.onload= function() { /*when the button is clicked, the information is obtained and manually encapsulated into the string "<tr><td>username</td><td>email</td><td>te Lephone</td><td><a href= ' # ' onclick= ' delrow (this) ' >Delete</a></td></tr> ' Get the table with ID tab, appropriate for the string above innerhtml+=. Question: How to delete the current line when you click the hyperlink. When the hyperlink is clicked, a Delrow method is called, and this is passed to the Delrow method. In the Delrow method, the TR that is eventually removed can be obtained by Parentnode.parentnode. This line is deleted by calling the RemoveChild method from the table. */document.getElementById ("btn"). onclick=function(){ //1. Get information. varusername=document.getElementById ("username"). Value; varEmail=document.getElementById ("Email"). Value; varTelephone=document.getElementById ("Telephone"). Value; //2. Spell the string. varmsg="<tr><td>"+username+"</td><td>"+Email+"</td><td>"+Telephone+"</td><td><a href= ' # ' onclick= ' delrow (this) ' >Delete</a></td></tr>" //3. Add msg to the table.document.getElementById ("Tab"). InnerHTML+=msg; document.getElementById ("username"). Value=""; document.getElementById ("Email"). Value=""; document.getElementById ("Telephone"). Value=""; } }; functionDelrow (t) {document.getElementById ("Tab"). RemoveChild (T.parentnode.parentnode.parentnode); //T.parentnode.parentnode.parentnode.removechild (t.parentnode.parentnode); }</Script></Head><Body> <Div> <BR> <BR>Name:<inputtype= "text"ID= "username">EMAIL:<inputtype= "text"ID= "Email">Phone:<inputtype= "text"ID= "Telephone"> <BR> <BR> <inputtype= "button"value= "Add"ID= "BTN"> <HR> <TableID= "tab"Border= ' 1 'Align= "Center"width= "85%"> <TR> <th>Name</th> <th>EMAIL</th> <th>Phone</th> <th>Operation</th> </TR> </Table> </Div></Body></HTML>
add element node-html
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
