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 莫多 代 ...
随机推荐
- ABAP CDS-介绍(ABAP CDS视图)
前言 文章翻译自Tushar Sharma的文章,转载请注明原作者和译者! 在SAP发展到SAP HANA版本之后,SAP内部的技术正在快速地变化,SAP开发业务应用程序的方式已经发生了范式转变(根本 ...
- jQuery 第八章 实例方法 遍历索引
遍历索引相关方法: .each() .index() ------------------------------------------------- .each() 有点像数组的 forEach( ...
- 商业智能(BI)可视化大屏的设计及使用原则
信息时代,数据是一种可贵的资源,我们可能经常听到的一句话就是:用数据说话.但是,在没有进行系统化整理之前,数据不过只是一串串冰冷的数字,我们很难从大量的数据中获取到有价值的信息.只有通过合适的可视化工 ...
- MySql学习笔记--详细整理--上
目录 MySql MySql安装 连接数据库 操作数据库 数据库的列类型 数据库的字段属性 创建数据库 修改删除表 数据管理 外键 DML语言 添加 修改 删除 DQL查询数据(重点) 查询 去重 w ...
- pip递归安装报错继续安装
使用命令pip freeze > requirements.txt导出项目依赖包之后,使用pip -r requirements.txt的时候可能会出现一些包安装出错,但是安装一旦出错,安装就会 ...
- Linux学习进度记录(一)
一.按系列罗列Linux的发行版,并描述不同版本之间的联系和区别 1. RHEL (RedHat Enterprise Linux):红帽企业版Linux,红帽公司是全球最大的开源技术厂商,RHE ...
- charles功能(一)修改request请求参数
1.接口处 鼠标右击,选择breakpoints(允许本接口使用breakpionts功能) 2.开始设置断点值 3.然后修改这一条 4.然后执行 5.最终结果
- DRF使用Serializer来进行序列化和反序列化操作
在serlizers中添加 # -*- coding: utf-8 -*- from rest_framework import serializers from .models import * c ...
- 第9章 Python文件操作目录
第9章 Python文件操作 第9.1节 Python的文件打开函数open简介 第9.2节 Python的文件打开函数open详解 第9.3节 Python的文件行读取:readline 第9.4节 ...
- 第12.1节 Python os模块导览
os 模块提供了许多与操作系统交互的函数,一定要使用 import os 而不是 from os import * ,这将避免内建的 open() 函数被 os.open() 隐式替换掉,它们的使用方 ...