提供了编程的基础技术教程

zl程序教程

您现在的位置是：首页 >  后端

当前栏目

table对象中的insertRow与deleteRow使用示例

对象 使用 示例 Table
2023-06-13 09:15:16 时间
复制代码代码如下:

<!DOCTYPEhtml>
<html>
<head>
<title>table1.html</title>

<metahttp-equiv="keywords"content="keyword1,keyword2,keyword3">
<metahttp-equiv="description"content="thisismypage">
<metahttp-equiv="content-type"content="text/html;charset=UTF-8">

<!--<linkrel="stylesheet"type="text/css"href="./styles.css">-->
<scriptlanguage="javascript"type="text/javascript">
<!--
functiontest1(){
//判断插入的编号是否已经存在
for(vari=0;i<mytable.rows.length;i++){
vareachRow=mytable.rows[i];
if(eachRow.cells[0].innerText==no.value){
window.alert("编号已经存在！");
return;
}
}
//获取表单中的数据
varnewTableRow=mytable.insertRow(mytable.rows.length);
newTableRow.insertCell(0).innerText=no.value;
newTableRow.insertCell(1).innerText=name1.value;
newTableRow.insertCell(2).innerText=nickName.value;
}

functiontest2(){
mytable.deleteRow(mytable.rows.length-1);
}
//-->
</script>
</head>

<body>
<h1>英雄排行榜</h1>
<tableid="mytable"border="1">
<tr><td>排名</td><td>姓名</td><td>外号</td></tr>
<tr><td>1</td><td>宋江</td><td>及时雨</td></tr>
<tr><td>2</td><td>卢俊义</td><td>玉麒麟</td></tr>
</table>
<h1>请输入新的好汉</h1>
编号<inputid="no"type="text"value=""><br/>
名字<inputid="name1"type="text"value=""><br/>
外号<inputid="nickName"type="text"value=""><br/>
<inputid="tianjia"type="button"value="添加"onclick="test1()">
<inputtype="button"value="删除最后一行"onclick="test2()"/>
</body>
</html>

 

相关文章