完成了,有幾個(gè)問題
<!DOCTYPE html>
<html>
?<head>
? <title> new document </title>??
? <meta http-equiv="Content-Type" content="text/html; charset=gbk"/>? ?
? <script type="text/javascript">?
??
? var number = 3;
? var xh = "xh00";
? ? ? window.onload = function(){
? ? ? ? ? ? ? ? ??
? ? ?// 鼠標(biāo)移動(dòng)改變背景,可以通過給每行綁定鼠標(biāo)移上事件和鼠標(biāo)移除事件來改變所在行背景色。
? ? ? ? ?var trs = document.getElementsByTagName("tr");
? ? ? ? ?for (var i = 0; i<trs.length; i++){
? ? ? ? ? ? ?trs[i].setAttribute("onmouseover","updatebg(id)");
? ? ? ? ? ? ?trs[i].setAttribute("onmouseout","updatebg2(id)");
? ? ? ? ?}
? ? ?
?
}
? ? ?
? ? ? // 編寫一個(gè)函數(shù),供添加按鈕調(diào)用,動(dòng)態(tài)在表格的最后一行添加子節(jié)點(diǎn);
? ? ?function add(){
? ? ? ? ?var name = prompt("請輸入姓名","姓名");
? ? ? ? ?var tr = document.createElement("tr");
? ? ? ? ?var id = "tr" + number;
? ? ? ? ?tr.setAttribute("id",id);
? ? ? ? ?tr.setAttribute("onmouseover","updatebg(id)");
? ? ? ? ?tr.setAttribute("onmouseout","updatebg2(id)");
? ? ? ? ?var xhtd = document.createElement("td");
? ? ? ? ?xhtd.innerHTML = xh + number;
? ? ? ? ?number++;
? ? ? ? ?var nametd = document.createElement("td");
? ? ? ? ?nametd.innerHTML = name;
? ? ? ? ?var deltd = document.createElement("td");
? ? ? ? ?var dela = document.createElement("a");
? ? ? ? ?dela.innerHTML = "刪除";
? ? ? ? ?dela.setAttribute("href","javascript:;");
? ? ? ? ?dela.setAttribute("onclick","deleteById(this);");
? ? ? ? ?deltd.appendChild(dela);
? ? ? ? ?tr.appendChild(xhtd);
? ? ? ? ?tr.appendChild(nametd);
? ? ? ? ?tr.appendChild(deltd);
? ? ? ? ?document.getElementsByTagName("table")[0].appendChild(tr);
? ? ?}
? ?
? ? ?
? ? ?// 創(chuàng)建刪除函數(shù)
? ? ?function deleteById(obj){
? ? ? ? ?var node = obj.parentNode.parentNode;
? ? ? ? ?node.parentNode.removeChild(node);
? ? ?}
function updatebg(id){
? ? document.getElementById(id).style.background = "#f2f2f2";
}
function updatebg2(id){
? ? document.getElementById(id).style.background = "#fff";
}
? </script>?
?</head>?
?<body>?
? ?<table border="1" width="50%" id="table">
? ?<tr>
<th>學(xué)號(hào)</th>
<th>姓名</th>
<th>操作</th>
? ?</tr>??
? ?<tr id="tr1">
<td>xh001</td>
<td>王小明</td>
<td><a href="javascript:;" onclick="deleteById(this);" >刪除</a></td>? ?<!--在刪除按鈕上添加點(diǎn)擊事件? -->
? ?</tr>
? ?<tr id="tr2">
<td>xh002</td>
<td>劉小芳</td>
<td><a href="javascript:;" onclick="deleteById(this);">刪除</a></td>? ?<!--在刪除按鈕上添加點(diǎn)擊事件? -->
? ?</tr>??
? ?</table>
? ?<input type="button" value="添加一行"? onclick="add()" />? ?<!--在添加按鈕上添加點(diǎn)擊事件? -->
?</body>
</html>
更改背景顏色通過CSS是不是更簡單快捷一點(diǎn)?應(yīng)該沒什么差別的把。然后就是刪除函數(shù)了,這個(gè)題目是不是超綱了,以前都沒講過this這個(gè)關(guān)鍵字,然后有沒有只用到前邊講過的知識(shí)點(diǎn)實(shí)現(xiàn)的。