Copy codeThe Code is as follows:
<! DOCTYPE html>
<Html>
<Head>
<Title> table1.html </title>
<Meta http-equiv = "keywords" content = "keyword1, keyword2, keyword3">
<Meta http-equiv = "description" content = "this is my page">
<Meta http-equiv = "content-type" content = "text/html; charset = UTF-8">
<! -- <Link rel = "stylesheet" type = "text/css" href = "./styles.css"> -->
<Script language = "javascript" type = "text/javascript">
<! --
Function test1 (){
// Determine whether the inserted number already exists
For (var I = 0; I <mytable. rows. length; I ++ ){
Var eachRow = mytable. rows [I];
If (eachRow. cells [0]. innerText = no. value ){
Window. alert ("number already exists! ");
Return;
}
}
// Obtain the data in the form
Var newTableRow = mytable. insertRow (mytable. rows. length );
NewTableRow. insertCell (0). innerText = no. value;
NewTableRow. insertCell (1). innerText = name1.value;
NewTableRow. insertCell (2). innerText = nickName. value;
}
Function test2 (){
Mytable. deleteRow (mytable. rows. length-1 );
}
// -->
</Script>
</Head>
<Body>
<H1> hero ranking <Table id = "mytable" border = "1">
<Tr> <td> ranking </td> <td> name </td> <td> nickname </td> </tr>
<Tr> <td> 1 </td> <td> Song Jiang </td> <td> timely rain </td> </tr>
<Tr> <td> 2 </td> <td> Lu Junyi </td> <td> Yu Qilin </td> </tr>
</Table>
<H1> enter a new hero No. <input id = "no" type = "text" value = ""> <br/>
Name <input id = "name1" type = "text" value = ""> <br/>
NickName <input id = "nickName" type = "text" value = ""> <br/>
<Input id = "tianjia" type = "button" value = "add" onclick = "test1 ()">
<Input type = "button" value = "Delete the last row" onclick = "test2 ()"/>
</Body>
</Html>