当前位置: 首页 > news >正文

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 οnclick="check(this);">
<th>学号</th>
<th>姓名</th>
<th>成绩</th>
</tr>
<tr οnclick="check(this);">
<td>01</td>
<td>张三</td>
<td>98.5</td>
</tr>
<tr οnclick="check(this);">
<td>02</td>
<td>李四</td>
<td>80.6</td>
</tr>
<tr οnclick="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" οnchange="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>

转载于:https://blog.51cto.com/13507330/2084386

相关文章:

  • Oracle 索引扫描的五种类型
  • 《Netty官方文档》开发者指南
  • 忘记cacti密码的解决方法
  • 2017 前端面试准备 - 收藏集 - 掘金
  • Xcode 各版本简介
  • VMware Ubuntu NAT 不能上网
  • 网络爬虫基本原理(一)
  • 音频中采样位数,采样率,比特率的名词解释(转)
  • Android内存泄漏的常见场景及解决方案
  • Linux CentOS下安装、配置mysql数据库
  • virtualenv和virtualenvwrapper的安装和使用
  • 【Kafka】
  • Android动画实现详解
  • HDU 1824 Let#39;s go home (2-SAT判定)
  • Java Proxy 和 CGLIB 动态代理原理
  • 【comparator, comparable】小总结
  • 【翻译】Mashape是如何管理15000个API和微服务的(三)
  • 2017届校招提前批面试回顾
  • C++类中的特殊成员函数
  • CentOS学习笔记 - 12. Nginx搭建Centos7.5远程repo
  • express.js的介绍及使用
  • Java反射-动态类加载和重新加载
  • mysql_config not found
  • Next.js之基础概念(二)
  • NLPIR语义挖掘平台推动行业大数据应用服务
  • SpringCloud集成分布式事务LCN (一)
  • swift基础之_对象 实例方法 对象方法。
  • Vue.js源码(2):初探List Rendering
  • WinRAR存在严重的安全漏洞影响5亿用户
  • 高度不固定时垂直居中
  • 解析 Webpack中import、require、按需加载的执行过程
  • 开年巨制!千人千面回放技术让你“看到”Flutter用户侧问题
  • 前端自动化解决方案
  • 入门到放弃node系列之Hello Word篇
  • 三栏布局总结
  • 网页视频流m3u8/ts视频下载
  • 微服务核心架构梳理
  • 微信如何实现自动跳转到用其他浏览器打开指定页面下载APP
  • 主流的CSS水平和垂直居中技术大全
  • elasticsearch-head插件安装
  • 没有任何编程基础可以直接学习python语言吗?学会后能够做什么? ...
  • ​插件化DPI在商用WIFI中的价值
  • # Swust 12th acm 邀请赛# [ A ] A+B problem [题解]
  • #!/usr/bin/python与#!/usr/bin/env python的区别
  • #微信小程序:微信小程序常见的配置传旨
  • (C语言)共用体union的用法举例
  • (第一天)包装对象、作用域、创建对象
  • (二)hibernate配置管理
  • (二)PySpark3:SparkSQL编程
  • (附源码)spring boot基于小程序酒店疫情系统 毕业设计 091931
  • (附源码)springboot 基于HTML5的个人网页的网站设计与实现 毕业设计 031623
  • (三)elasticsearch 源码之启动流程分析
  • (五)MySQL的备份及恢复
  • (学习日记)2024.03.25:UCOSIII第二十二节:系统启动流程详解
  • (转)EOS中账户、钱包和密钥的关系