站点Unit05目录
实时显示日期与时间——DisplayDateAndTimeLive.html 访问
- 使用原生的JavaScript，设计要点如下：
- （1）定义一个名为displayDT的方法，获取当前的日期与时间并刷新DOM元素，使用Windows的定时器方法setTimeout()并进行递归调用。
- （2）定义页面加载事件onload，执行方法displayDT()。
一组图片的循环滚动——scrollingImages.html 访问
- 使用HTML的marquee标签制作的滚动效果，尾部存在空白。
- 使用原生的JavaScript脚本实现的滚动效果，尾部没有空白。设计要点如下：
- （1）名为main的div作为父容器使用相对定位，名为sm的div作为子容器使用绝对定位，初始包含5幅宽度相同的图片。
- （2）在脚本里，设置sm的宽度为main的2倍，包含10幅图片。此时，main的超出部分将被隐藏。
- （3）使用window对象的定时器方法即时改变sm对象的left样式属性，循环向左移动sm对象，出现消失效果。当第5幅图片也完全消失时，将sm的位置复位。
- 总之，使用JavaScript复制图片内容和修改滚动容器的位置属性（CSS样式），结合Window定时器来实现图片从右向左的无缝循环滚动。
图片新闻——pictureNews.html 访问
- 调用第三方JavaScript脚本库babyzone.js里定义的对象及其方法，第1参数为图片数量。
- 第2参数banner_list为包含一组图片的div的id。
- 第3参数list为项目列表ul的id。
- 第4参数banner_index为超链接a的id。图片可以自动变化或手动链接变化。
访问天气后台接口，显示城市天气信息——useWeatherJson.html 访问
- 访问https://api.vvhan.com/api/weather?city=深圳，可得到深圳市今日天气信息的JSON数据。
- 使用Postwoman请求后台接口，可以在线解析JSON数据可以使用折叠数据信息，方便查找目标数据。
下拉列表联动——UrbanInterConnectivity.html调用UrbanInterConnectivity.php
访问
- 后台程序UrbanInterConnectivity.php返回数据类型为json字符串，使用浏览器访问或Postwoman测试可验证（需要传递参数sf_id）。
- 在jQuery的$.ajax()方法里，通过dataType:"json"或JSON.parse()可转换为json对象。
- 在$.ajax()方法里，需要使用dataType:"json"指定php后台程序返回json数据类型。否则，引起遍历错误并在控制台输出错误信息，使用debugger可测试。
- 在$.ajax()方法里，当未指定dataType:"json"时，使用response=JSON.parse(response)也可。
- 严格地说，$.ajax()方法里data域的json对象的键名应使用一对双引号。省略请求参数键名的一对双引号时，JavaScript引擎在发请求时会自动添加一对双引号。
浏览器存储——localStorageAndsessionStorage.html 访问
- 访问https://movie.douban.com，可搜索不同电影的id。例如，舌尖上的中国（第一季）的id为10606004。
- 访问https://movie.querydata.org/api?id=10606004，可以得到电影相关信息的json格式数据。
- 不同电影的json数据格式是相同的，使用Postwoman或访问https://www.json.cn，可以在线解析json数据可以使用折叠数据信息，方便查找目标数据。