1.創建table表格,要求:
點擊某一行,則該行變色(選中)。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>創建Table表格</title>
<script type="text/javascript">
function check(obj) {
var len = document.getElementsByTagName("tr").length;
for (var i = 0; i < len; i++) {
var temp = document.getElementsByTagName("tr")[i];
if (obj == temp) {
temp.style.background="yellow";
}else {
temp.style.background="";
}
}
}
</script>
</head>
<body>
<table width="50%" border="1" cellpadding="2" cellspacing="0" align="center">
<tr onclick="check(this);">
<th>學號</th>
<th>姓名</th>
<th>成績</th>
</tr>
<tr onclick="check(this);">
<td>01</td>
<td>張三</td>
<td>98.5</td>
</tr>
<tr onclick="check(this);">
<td>02</td>
<td>李四</td>
<td>80.6</td>
</tr>
<tr onclick="check(this);">
<td>03</td>
<td>王五</td>
<td>89.5</td>
</tr>
</table>
</body>
</html>
2.用下拉列表框實現省市級聯效果。
<select>
<option value=""></option>
</select>
提示:使用數組
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>下拉列表省市級聯</title>
<script type="text/javascript">
var city = [
["西安","安康","寶雞","漢中","商洛","銅川","渭南","咸陽","延安","榆林"],
["成都","阿壩州","巴中","達州","德陽"],
["太原","長治","大同","晉城","晉中"],
["濟南","濱州","東營","德州","菏澤"]
];
function getCity() {
var nProvince = document.form1.province;
var nCity = document.form1.city;
var provinceCity = city[nProvince.selectedIndex - 1];
nCity.length = 1;
for (var i = 0; i < provinceCity.length; i++) {
nCity[i+1] = new Option(provinceCity[i],provinceCity[i]);
}
}
</script>
</head>
<body>
<form method="post" action="" name="form1">
地區查找:
<select name="province" onchange="getCity()">
<option value="0" >請選擇省份</option>
<option value="陝西">陝西</option>
<option value="四川">四川</option>
<option value="山西">山西</option>
<option value="山東">山東</option>
</select>
<select name="city">
<option value="0">選擇城市</option>
</select>
</form>
</body>
</html>