table對象中的insertRow與deleteRow使用示例
更新時間:2014年01月26日 15:54:31 作者:
本文為大家介紹下table對象insertRow deleteRow的使用示例,適合新手朋友們
復制代碼 代碼如下:
<!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(){
//判斷插入的編號是否已經(jīng)存在
for(var i=0;i<mytable.rows.length;i++){
var eachRow = mytable.rows[i];
if(eachRow.cells[0].innerText == no.value){
window.alert("編號已經(jīng)存在!");
return ;
}
}
//獲取表單中的數(shù)據(jù)
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>英雄排行榜</h1>
<table id = "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>
編號<input id = "no" type = "text" value = ""><br/>
名字<input id = "name1" type = "text" value = ""><br/>
外號<input id = "nickName" type = "text" value = ""><br/>
<input id = "tianjia" type = "button" value = "添加" onclick = "test1()">
<input type = "button" value = "刪除最后一行" onclick = "test2()"/>
</body>
</html>

相關文章
js代碼判斷瀏覽器種類IE、FF、Opera、Safari、chrome及版本
這篇文章主要分享了判斷IE、FF、Opera、Safari、Chrome等瀏覽器和版本的兩種方法,需要的朋友可以參考下2014-05-05微信小程序?qū)崿F(xiàn)卡片左右滑動效果的示例代碼
這篇文章主要介紹了微信小程序?qū)崿F(xiàn)卡片左右滑動效果的示例代碼,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧2019-05-05RGB轉(zhuǎn)換實現(xiàn)代碼,淘寶前端開發(fā)工程師筆試題
寫一個轉(zhuǎn)換RGB的值的函數(shù),實現(xiàn)以下效果。2010-11-11