每日一练---js动态添加删除table行

最新推荐文章于 2018-07-18 09:39:38 发布

weiweismile123

最新推荐文章于 2018-07-18 09:39:38 发布

阅读量317

点赞数

分类专栏：前端每日一练

本文链接：https://blog.csdn.net/weiweismile123/article/details/53122013

版权

前端每日一练专栏收录该内容

12 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>定时器</title>
<style type="text/css">
table td{
border: 1px solid #ccc;
}
</style>
<script type="text/javascript">
function hh(){
var table=document.getElementById("table");
var tr =document.createElement("tr");
var td1=document.createElement("td");
td1.innerHTML="no";
var td2=document.createElement("td");
td2.innerHTML="name";
var td3=document.createElement("td");
td3.innerHTML="sex";
tr.appendChild(td1);
tr.appendChild(td2);
tr.appendChild(td3);
table.appendChild(tr);
}
function kk(){
var table=document.getElementById("table");
table.removeChild(table.lastChild);
}
</script>
</head>
<body>
<form>
<input type="button" name="add" value="add" οnclick="hh()">
<input type="button" name="remove" value="remove" οnclick="kk()">
</form>
<table style="border: 1px solid #ccc;" id="table">
<tr>
<td>no</td>
<td>name</td>
<td>sex</td>

</tr>
<tr>
<td>no</td>
<td>name</td>
<td>sex</td>

</tr>
<tr>
<td>no</td>
<td>name</td>
<td>sex</td>

</tr>
</table>
</body>

</html>

1、 //document.createTextNode(data)用来创建文本节点，返回新的text节点

2、关于window.onload加载函数的问题。-----出现函数未定义的现象

（解释http://blog.csdn.net/qq_29377109/article/details/51900802）

weiweismile123

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
每日一练---js动态添加删除table行

定时器table td{border: 1px solid #ccc;} function hh(){ var table=document.getElementById("table"); var tr =document.createElement("tr"); var td1=document.createElement
复制链接

扫一扫

专栏目录