分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 运营维护

js练习题

发布时间:2023-09-06 01:45责任编辑:沈小雨关键词:js
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>

js练习题

原文地址:http://blog.51cto.com/13507330/2084386

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved