console
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>第六章</title>
<style type="text/css">
.text{width:25px;autocomplete:off;}
table {
color: #006;
background: #999;
font-family: "宋体";
border: 2px solid red;
}
caption {
font-size: 16px;
font-weight: bolder;
}
th {
color: #003;
background: #90c;
}
</style>
</head>
<body>
<table border="1px" id="score">
<caption>成绩表</caption>
<tr id="tr1">
<th>姓名</th>
<th>语文</th>
<th>数学</th>
<th>英语</th>
</tr>
<tr>
<td>张三</td>
<td>89</td>
<td>98</td>
<td>88</td>
</tr>
<tr>
<td>李四</td>
<td>79</td>
<td>97</td>
<td>96</td>
</tr>
<tr>
<td>王五</td>
<td>88</td>
<td>95</td>
<td>80</td>
</tr>
<tr>
<td>赵六</td>
<td>66</td>
<td>99</td>
<td>95</td>
</tr>
</table>
<input type="text" class="text" id="text1"/>
<input type="text" class="text" id="text2"/>
<input type="text" class="text" id="text3"/>
<input type="button" value="修改" onclick="xiugai()"/><br/>
<input type="button" value="加行" onclick="xin()"/>
<button onclick="xin1()">增行</button>
<input type="button" value="加列" onclick="xin3()"/><br/>
<input type="text" class="text" id="text4"/>
<button onclick="dele()">删除</button><br />
<input type="text" class="text" name="text5"/>
<button onclick="runtu()">闰年与否</button><br />
<script type="text/JavaScript" ;language="JavaScript">
function xin(){
var trNode = document.createElement("tr");
var tdNode = document.createElement("td");
var textNode = document.createTextNode("加行");
tdNode.appendChild(textNode)
trNode.appendChild(tdNode,tdNode);
document.getElementById('score').appendChild(tdNode);
}
function xin1(){
var o1 = document.getElementById("score").insertRow(HTMLTableElement.LENGTH);
console.log(o1)
var content = new Array();
content[0]=document.createTextNode("马七");
content[1]=document.createTextNode(Math.floor(Math.random()*101));
content[2]=document.createTextNode(Math.floor(Math.random()*101));
content[3]=document.createTextNode(Math.floor(Math.random()*101));
for(var i = 0;i<content.length;i++){
var o2 = o1.insertCell(i);
o2.appendChild(content[i]);
}
}
function xin3(){
var th = document.getElementById("tr1").insertCell(HTMLTableElement.LENGTH);
th.innerHTML="物理";
}
function xiugai(){
var text1 = document.getElementById("text1").value;
var text2 = document.getElementById("text2").value;
var text3 = document.getElementById("text3").value;
var c = document.getElementById("score");
c.rows[text1].cells[text2].innerHTML=text3;
}
function del(){
var num = document.getElementById("text4").value;
var dele = document.getElementById("score");
dele.deleteRow(num);
}
function shan(){
var dele = document.getElementById("score");
this.parentNode.parentNode.parentNode.removeChild(this.parentNode.parentNode);
}
function dele(){
var delet = document.getElementById("score");
var sc;
for(var i =1;i<delet.rows.length;i++){
sc = delet.rows[i].insertCell(4);
sc.innerHTML = "<a href='#'>删除</a>";
sc.firstChild.onclick = shan;
}
}
function runtu(){
var txtYear = document.all.text5;
var txt = txtYear.value;
if((!txtYear) || (txtYear.length < 1)||(txtYear < 0)){
window.alert("请输入正确的年份");
txtYear.focus();
return;
}
}
</script>
</body>
</html>