1、任务背景
为了摆脱:成为(只会CRUD), 没有自我核心竞争力, 无思想的编程的大龄码农。
所以:开展了本次实验,目的是(去了解算法、去欣赏它的美、去感受它的优雅)使自己成为有灵魂的工程师.
2、任务大纲
一、任务一:轮播图片
⽤HTML + CSS + JavaScript在⻚⾯正中⽣成⼀幅⼴告图⽚
二、任务二: JS语法学习
在code.org上用(所⻅即所得)的编码⽅式完成(应⽤实验室)系列任务
三、拓展任务:省市区联调
⽤HTML + CSS + JavaScript实现⽹⻚上常⻅的(省市区多级联动下拉菜单)(理解树型数据结构)
四、⾃测题
1、实现对数组[0,9,12,1,6,3,7,11]的冒泡排序。
2、解释JavaScript中的堆和栈数据结构的区别。
3、a=1,b=2,使⽤⾄少三种⽅法交换变量a和b的值。
4、使⽤for循环求出0~300之间的奇数之和。
5、去除数组[8, 7, 2, 1, 5, 0, 1, 9, 2]中重复的值,相同的值只保留⼀个。
6、使⽤⾮递归⽅式对数组[8, 7, 12, 1, 5, 0, 6, 9, 2]执⾏折半查找。
3、解决任务
3.1、任务一:轮播图片
任务需求:⽤HTML + CSS + JavaScript在⻚⾯正中⽣成⼀幅⼴告图⽚
3.1.1、效果图
图片选材:我目前就读的(学校)
3.1.2、实现方法
第一步:(先放一张图片)跑起来
<img id="img" src="图片地址.jpg" alt="">
第二步:写一个(图片切换函数)
第三步:通过setInterval("切换图片函数", 3000); 实现(每3秒切换一张图片)
3.1.3、代码
存放位置:百度网盘 提取码:jja3
3.2、任务二:JS语法学习
3.3、拓展任务:省市区联调
⽤HTML + CSS + JavaScript实现⽹⻚上常⻅的(省市区多级联动下拉菜单)
3.3.1、效果图
注意option选中(背景色):若需更换, 可能需要(div + ul + li)模拟下拉框,我并未修改。
3.3.2、实现方法
1、存数据:
通过(构建对象)容纳(包含:省、市、区)的信息。
2、搭框架:
通过书写(3个) <select>标签, 快速搭建出(省、市、区)模型。
3、取结点
通过给(省、市、区)的select 标签附上(独自id), document.getElementById("id名")获取
4、做修改
写4个函数分别为:默认(加载省)、(已选省:加载市)、(已选省市:加载区)、(选中区存数据)
3.3.3、代码
存放位置:百度网盘 提取码:jja3
4、⾃测题
4.1、习题大纲
习题(答案位置):百度网盘 提取码:jja3
1、实现对数组[0,9,12,1,6,3,7,11]的冒泡排序。
2、解释JavaScript中的堆和栈数据结构的区别。
3、a=1,b=2,使⽤⾄少三种⽅法交换变量a和b的值。
4、使⽤for循环求出0~300之间的奇数之和。
5、去除数组[8, 7, 2, 1, 5, 0, 1, 9, 2]中重复的值,相同的值只保留⼀个。
6、使⽤⾮递归⽅式对数组[8, 7, 12, 1, 5, 0, 6, 9, 2]执⾏折半查找。
4.2、习题二:讲解
题目:解释JavaScript中的堆和栈数据结构的区别。
参考博客:博客园
二者区别:
堆:(动态分配)内存,内存大小不一,也不会自动释放。
栈:(自动分配) 相对固定大小的内存空间,并由系统自动释放。
5、总结
一个疑问(油然而生):不学习算法(难道不可以)吗?
我想:它是可以的。
但是呢? 正如我们的人生, 倘若只是生活, 而不去(总结生活)的规律。
那么,岁数的增长,与心智的成长可能不再是:正比例函数;而是,固执己见的(反比例函数)