js第二次作业——2019.10.16
第一题：完成省城市的三级联动（包括湖南省），附代码和效果图。
1 <!DOCTYPE HTML>
2 <html>
3 <head>
4 </head>
5 <body>
6 <select id="province">
7 <option value="-1">请选择</option>
8 </select>
9 <select id="city"></select>
10 <select id="country"></select>
11 <script type="text/javascript">
12 var provinceArr = ['上海','江苏','湖南'];
13 var cityArr = [
14 ['上海市'],
15 ['苏州市','南京市','扬州市'],
16 ['长沙市','常德市','张家界市']
17 ];
18 var countryArr = [
19 [
20 ['黄浦区','静安区','长宁区','浦东区']
21 ],
22 [
23 ['虎丘区','吴中区','相城区','姑苏区','吴江区'],['玄武区','秦淮区','建邺区','鼓楼区','浦口区'],['邗江区 ','广陵区','江都区']
24 ],
25 [
26 ['岳麓区','雨花区','望城区','芙蓉区'],['武陵区','鼎城区'],['永定区','武陵源区']
27 ]
28 ];
29 function createOption(obj,data){
30 for(var i in data){
31 var op = new Option(data[i],i);
32 obj.options.add(op);
33 }
34 }
35 var province = document.getElementById('province');
36 createOption(province,provinceArr);
37 var city = document.getElementById('city');
38 province.onchange = function(){
39 city.options.length = 0;
40 createOption(city,cityArr[province.value]);
41 };
42 var country = document.getElementById('country');
43 city.onchange = function(){
44 country.options.length = 0;
45 createOption(country,countryArr[province.value][city.value]);
46 };
47 province.onchange = function(){
48 city.options.length = 0;
49 createOption(city,cityArr[province.value]);
50 if(province.value>=0){
51 city.onchange();
52 }
53 else{
54 country.options.length = 0;
55 }
56 };
57 </script>
58 </body>
59 </html>
第二题：移出数组arr([1,2,3,4,2,5,6,2,7,2])中与2相等的元素，并生成一个新数组,不改变原数组。
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta charset="utf-8">
5 </head>
6 <body>
7 <script>
8 var arr = [1,2,3,4,2,5,6,2,7,2];
9 document.write("原数组：<br/>" + arr);
10 var a= arr.slice(3,4);
11 var b = arr.slice(0,1);
12 var c = arr.slice(2,3);
13 var d = arr.slice(5,6);
14 var e = arr.slice(6,7);
15 var f = arr.slice(8,9);
16 str = b.concat(c,a,d,e,f);
17 document.write("<br/>");
18 document.write("新数组：<br/>" + str);
19 document.write("<br/>");
20 document.write("原数组arr：<br/>" + arr);
21 </script>
22 </body>
23 </html>
第三题：编写函数实现单击change按钮，为div元素添加红色双线的边框。
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta charset="utf-8">
5 <style type="text/css">
6 div{
7 font-family: "Helvetica Neue",Helvetica,Arial,"Microsoft Yahei",sans-serif;
8 width: 600px;
9 text-align: center;
10 }
11 .haha{
12 margin-top: 20px;
13 margin-left: 250px;
14 font-size: 20px;
15 }
16 .haha:hover{
17 border: 3px solid purple;
18 }
19 </style>
20 </head>
21 <body>
22 <div id="joy">
23 <p>努力学习</p>
24 </div>
25 <button class="haha" onclick="myFunction()">change</button>
26 <script type="text/javascript">
27 function myFunction(){
28 var Color = document.getElementById("joy");
29 Color.style.border = "3px double red";
30 Color.innerHTML = "<p>加油！</p>";
31
32 }
33 </script>
34 </body>
35 </html>
实训感想：还需多加努力，以便之后自己有更多的技能去面对困难。
js第二次作业——2019.10.16的更多相关文章
- 2019.10.16&17小结
话说也蛮久没写小结了,主要这两次考试失分严重,还是总结下吧. 10.16 T1 小奇挖矿2 100/0 [题目背景] 小奇飞船的钻头开启了无限耐久+精准采集模式!这次它要将原矿运到泛光之源的矿石交易市 ...
- C 题解———2019.10.16
现在很痛苦,等过阵子回头看看,会发现其实那都不算事. [题目描述]定义一个排列 a 的价值为满足|a[i]-i|<=1 的 i 的数量.给出三个正整数 n,m,p,求出长度为 n 且价值恰好为 ...
- A 题解————2019.10.16
[题目描述] 对于给定的一个正整数n, 判断n是否能分成若干个正整数之和 (可以重复) ,其中每个正整数都能表示成两个质数乘积. [输入描述]第一行一个正整数 q,表示询问组数.接下来 q 行,每行一 ...
- jQuery进阶第二天（2019 10.10）
一.事件流程 1.事件的三要素: 事件源:发生事件的对象 事件类型:类型比如单击.双击.鼠标的移入.移除 事件处理程序: 触发事件之后做些什么,事件处理的函数 <body> <but ...
- @CSP模拟2019.10.16 - T3@ 垃圾分类
目录 @description@ @solution@ @accepted code@ @details@ @description@ 为了保护环境,p6pou建设了一个垃圾分类器. 垃圾分类器是一个 ...
- B 题解————2019.10.16
相信他说的话,但不要当真 [题目描述]有一个长度为 n 的自然数序列 a,要求将这个序列恰好分成至少 m 个连续子段. 每个子段的价值为该子段的所有数的按位异或.要使所有子段的价值按位与的结果最大,输 ...
- FZU2018级算法第二次作业 2.10 逆序数（权值线段树）
题目: Nk 最近喜欢上了研究逆序数,给出一个由 1…n 组成的数列 a1,a2,a3…an, a1的逆序数就是在 a2…an 中,比 a1 小的数的数量,而 a2 的逆序数就是 a3….an 中比 ...
- BUAA OO 2019 第二单元作业总结
目录 总 架构 controller model view 优化算法 Look 算法 多种算法取优 预测未来 多线程 第五次作业 第六次作业 第七次作业 代码静态分析 UML 类图 类复杂度 类总代码 ...
- 【2019.10.17】十天Web前端程序员体验（软件工程实践第五次作业）
结对信息.具体分工 Github地址:https://github.com/MokouTyan/131700101-031702425 学号 昵称 主要负责内容 博客地址 131700101 莫多 代 ...
随机推荐
- 新鲜出炉！JAVA线程池精华篇深度讲解，看完你还怕面试被问到吗？
前言 前两天趁着假期在整理粉丝私信的时候看到一个粉丝朋友的私信跟我说自己现在正在复习准备面试,自己在复习到线程池这一块的时候有点卡壳,总感觉自己差了点什么.想要我帮他指导一下.这不趁着假期我也有时间我 ...
- 在FL Studio中如何更好地为人声加上混响（进阶教程）
为人声加上混响是我们在处理人声过程中必不可少的一步.然而,除了直接在人声混音轨道加上混响插件进行调节以外,这里还有更为细节的做法可以达到更好的效果. 步骤一:使用均衡器 在为人声加上混响之前,我们应该 ...
- tcp连接的三次握手
为什么tcp连接需要三次握手才能建立连接 主要是为了初始化sequence number的初始值,通信的双方要互相通知双方的sequence number,这个要作为以后数据通信的序号,保证以后不会因 ...
- JDBC事务提交机制以及解决方案
JDBC中的事务是自动提交的,什么是自动提交? 只要任意执行一条DML语句,则自动提交一次.这是JDBC默认的事务行为.但是实际业务当中,通常都是N条DML语句共同联合才能完成的,必须保证它们这些DM ...
- kafka 消息存储分析
kafka 可以支持海量数据发送,轻轻松松QPS过十万,如果JVM内存存储这一块如果不够优秀,根本无法支持这么庞大的QPS. 存储架构(这里这是落地数据,并木有涉及到序列化发送数据到broker) R ...
- Java集合【4】-- iterable和Iterator的异同分析详解
目录 一.iterator介绍 二.iterable接口 三.为什么有Iterator还需要Iterable 一.iterator介绍 iterator接口,也是集合大家庭中的一员.和其他的Map和C ...
- C++基础知识篇：C++ 变量作用域
作用域是程序的一个区域,一般来说有三个地方可以定义变量: 在函数或一个代码块内部声明的变量,称为局部变量. 在函数参数的定义中声明的变量,称为形式参数. 在所有函数外部声明的变量,称为全局变量. 我们 ...
- MinIO
MinIO 是一个非常轻量的基于 Apache License v2.0 开源协议的对象存储服务.它兼容亚马逊 S3 云存储服务接口,非常适合于存储大容量非结构化的数据,例如图片.视频.日志文件.备份 ...
- Codeforces Round #688(Div 2) D. Checkpoints
思路 第一步,先推导1,0,0,--,0,就是1后面跟了n-1个0的时候 所需要的期望步数 封闭式推导 \(f_n\)代表从n关开始直接通关需要的步数的期望 n为1的情况,即就只有一个1 \(f_1= ...
- 最常用的分布式ID解决方案，你知道几个
一.分布式ID概念 说起ID,特性就是唯一,在人的世界里,ID就是身份证,是每个人的唯一的身份标识.在复杂的分布式系统中,往往也需要对大量的数据和消息进行唯一标识.举个例子,数据库的ID字段在单体的情 ...