动态改变内容：HTML + JavaScript
动态改变内容：HTML + JavaScript
动态改变内容：HTML + JavaScript
用到的技术：HTML + JavaScript;主要以javascript为主。
操作步骤：
1.首先制作一个html表格页面，代码如下
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>动态操作表格</title></head>
<body>
<input type="button" value="添加一行" onclick="addRow()"/>
<input type="button" value="删除最后一行" onclick="delRow()"/>
<table id="mytable" border="1" width="400">
<thead>
<th>公司</th>
<th>职业</th>
<th>工资</th>
</thead>
<tr>
<td>石家庄康诺科技</td>
<td>java工程师</td>
<td>6000</td>
</tr>
<tr>
<td>石家庄康诺科技</td>
<td>安卓工程师</td>
<td>8000</td>
</tr>
<tr>
<td>石家庄康诺科技</td>
<td>java实习生</td>
<td>3000</td>
</tr>
<tr>
<td>石家庄康诺科技</td>
<td>web前段工程师</td>
<td>5000</td>
</tr> </table>
</body> </html>
2.利用javascript实现添加和删除表格；代码如下
<script type="text/javascript">
window.onload = function(){
var mytable = document.getElementById("mytable");
}
function addRow(){
var len = mytable.rows.length;
var newRow = mytable.insertRow(len);
newRow.insertCell(0).innerHTML = "石家庄康诺科技";
newRow.insertCell(1).innerHTML = "康诺科技员工";
newRow.insertCell(2).innerHTML = 10000;
}
function delRow(){
var len = mytable.rows.length-1;
if(len <= 0) {
alert("不能删除表头")
return false;
}
mytable.deleteRow(len);
}
</script>
版权归属：石家庄康诺网络科技有限公司
2017/7/6