HTML5与JavaScript教学大纲

西北师范大学计算机专业课程教学大纲1西北师范大学计算机专业课程教学大纲HTML5与JavaScript一、说明（一）课程性质学院平台选修课程。（二）教学目的通过本课程的学习，使学生掌握HTML5，CSS及JavaScript综合应用，掌握网页开发技术的基础与核心，熟悉开发符合Web标准规范网页的技巧与方法，能够使用HTML5与JavaScript编写可交互Web应用程序，创建一些实用的Web应用。（三）教学内容教学内容主要包括利用HTML5制作网站，使用CSS3美化HTML5网页，JavaScript基础，JavaScript对象模型，JavaScript表单、样式与定位，HTML5画布，HTML5音频与视频，Web存储，Web离线应用，Workers多线程处理，Geolocation地理位置等（四）教学时数本课程教学时数共72学时，其中讲授36学时，实验36学时。（五）教学方式使用讲授加实践的方式进行教学，由浅入深地进行各种基础知识的讲解。通过综合实例的训练让学生熟练掌握各种知识的实际应用。讲授时需利用多种现代化媒体进行教学辅助。二、本文理论部分上篇基础应用第1章利用HTML5制作网站教学要点：本章使学生重点掌握HTML5与之前的版本相比的革命性变化，包括网页结构、设计风格及理念的变化，表单数据内容进化，了解Web技术的变化趋势，掌握简单的HTML5网站的规划与实现。教学时数：3学时教学内容：1.1HTML5时代的网页设计1.2HTML5带来的网页结构、设计风格及理念的变化1.2.1HTML4时代的几个特征1.2.2Web标准与规范1.2.3一个典型的HTML5页面1.3HTML5带来的标签变化1.3.1什么是标签1.3.2标签的分类1.3.3近十几年来的HTML1.3.4Web的变化趋势西北师范大学计算机专业课程教学大纲21.4HTML5带来的表单数据内容进化1.4.1数据提交格式的变化1.4.2数据提交范围的变化1.4.3表单数据类型的增加1.4.4表单属性和验证方式的进化1.4.5文件上传控件和重复模型的应用1.5HTML5与SEO1.5.1技术趋势1.5.2搜索引擎服务商面临的问题1.5.3SEO从业人员面临的问题1.5.4SEO面临的几个社会问题1.6HTML5的开发环境与调试环境1.6.1HTML5编写工具1.6.2JavaScript开发1.6.3HTTP监控1.6.4调试环境1.7案例：HTML5网站建设1.7.1需求的提出1.7.2需求分析1.7.3系统分析1.7.4工程实现第2章从HTML、XHTML到HTML5教学要点：本章重点使学生了解HTML，XHTML的结构，语法等特性，了解HTML5增加及废除标签，熟悉HTML5新增标签的功能及其使用方法。教学时数：2学时教学内容：2.1HTML基础2.1.1HTML简介2.1.2HTML特性2.1.3HTML结构2.1.4HTML语法2.1.5HTML标签2.1.6HTML属性2.2XHTML基础2.2.1XHTML结构2.2.2XHTML语法2.2.3XHTML类型2.2.4DTD解析2.2.5命名空间2.3HTML5基础2.3.1HTML5语法西北师范大学计算机专业课程教学大纲32.3.2HTML5元素2.3.3HTML5增加及废除的属性2.3.4HTML5全局属性2.3.5HTML5其他功能第3章使用CSS3美化HTML5文档教学要点：本章重点使学生掌握使用CSS美化HTML5文档的技巧与方法，熟悉掌握常用页面布局的形式，能进行常用页面的布局设计与实现。教学时数：4学时教学内容：3.1CSS概述3.1.1CSS发展简史3.1.2CSS1.0和CSS2.0概述3.1.3CSS3编码规范3.1.4HTML5文档使用CSS33.2CSS美化页面3.2.1字体属性3.2.2文本高级样式3.2.3段落属性3.2.4图片样式3.2.5图文混排3.2.6背景相关属性3.2.7边框3.3网页布局3.3.1设计多列布局3.3.2设置多列显示样式3.3.2.1定义列宽3.3.2.2定义列数3.3.2.3定义列间距3.3.2.4定义列边框样式3.3.2.5定义跨列显示3.3.2.6定义列高度3.3.2.7定义打印列3.3.3设计盒布局3.3.4设置盒布局格式3.3.4.1定义自适应宽度3.3.4.2定义列显示顺序3.3.4.3定义列排列方向3.3.4.4定义模块大小自适应3.3.4.5消除空白3.3.4.6定义对齐方式3.3.5综合实战：设计多列网页西北师范大学计算机专业课程教学大纲4第4章JavaScript基础教学要点：使学生了解JavaScript与Jscript、ECMAScript之间的关系与区别，掌握JavaScript的变量、条件语句、循环、函数与对象的使用方法。教学时数：4学时教学内容：4.1JavaScript概述4.1.1什么是JavaScript4.1.2Jscript与ECMAScript4.1.3在网页使用JavaScript代码4.1.4JavaScript标识符4.1.5JavaScript语句4.1.6JavaScript代码块4.1.7JavaScript注释，单行注释与多行注释4.1.8JavaScript中的数据类型与特殊的值4.1.9转义符4.2变量，条件语句，循环4.2.1JavaScript变量4.2.2JavaScript算术运算符4.2.3JavaScript赋值运算符4.2.4JavaScript比较运算符4.2.5JavaScript逻辑运算符4.2.6弱类型变量的运算4.2.7条件语句4.2.8JavaScript中的循环4.3函数与对象4.3.1JavaScript函数4.3.2数组4.3.3对象4.3.4内部对象Math4.3.5内部对象Date对象4.3.6内部对象String对象4.3.7JavaScript全局对象与全局函数第5章对象模型教学要点：使学生重点掌握浏览器对象模型和文档对象模型的实际应用方法。教学时数：2学时教学内容：5.1BOM5.1.1BOM体系结构5.1.2BOM的作用5.1.3History对象西北师范大学计算机专业课程教学大纲55.1.4Location对象5.1.5Navigator对象5.2框架与多窗口通信5.3浏览器检测5.4DOM5.4.1DOM结构与BOM的关系5.4.2利用DOM结构访问HTML标签的方法5.4.3获取和设置元素属性5.4.4节点5.5.5HTMLDOM第6章表单、样式与定位教学要点：使学生重点掌握网页中表单对象的属性及使用方法，掌握表格及其事件处理方法，并能够进行表单、表格对象的样式设计与定位。教学时数：4学时教学内容：6.1forms对象6.1.1form对象的集合6.1.2form对象的属性6.1.3form对象的专用的事件属性6.1.4form对象的方法6.2表单元素的方法6.3表单元素的属性6.4常用的一些js表单验证6.5表格与事件6.5.1JS访问表格6.5.2表格对象的方法6.5.3表格行对象的方法与属性与单元格对象的属性6.5.4事件6.5.5给事件注册多个函数6.5.6事件对象6.5.7事件传播——冒泡与捕获6.5.8标准化事件对象，兼容性处理6.6样式与定位6.6.1修改元素的外观6.6.2获取最终应用到元素上的CSS样式6.6.3访问外部样式文件中的CSS样式6.6.4关于元素尺寸的获取(这里只讨论块元素的情况)6.6.5关于页面窗口尺寸的获取6.6.6关于元素边框大小的获取6.6.7关于元素坐标位置的获取6.6.8最简单的拖动效果下篇高级应用西北师范大学计算机专业课程教学大纲6第7章HTML5画布教学要点：使学生掌握使用HTML5canvas元素进行平面图形，文字及2D图形的绘制，进行图形的各种变换以及控制操作。教学时数：4学时教学内容：7.1认识HTML5canvas元素7.1.1在页面中添加canvas元素7.1.2Canvas如何绘制图形7.1.3认识Canvas坐标7.1.4何时不用Canvas7.1.5如果浏览器不支持Canvas7.1.6检测浏览器支持7.2绘制简单图形7.2.1绘制直线7.2.2绘制矩形7.2.3绘制圆形7.2.4绘制三角形7.2.5清空画布7.3绘制贝塞尔曲线7.3.1绘制二次方贝塞尔曲线7.3.2绘制三次方贝塞尔曲线7.4图形的变换7.4.1保存与恢复Canvas状态7.4.2移动坐标空间7.4.3旋转坐标空间7.4.4缩放图形7.4.5矩阵变换7.5图形的组合与裁切7.5.1图形的组合7.5.2裁切路径7.6更多的颜色和样式选项7.6.1应用不同的线型7.6.2绘制线性渐变7.6.3绘制径向渐变7.6.4绘制图案7.6.5设置图形的透明度7.6.6创建阴影7.7绘制文字7.7.1绘制填充文字7.7.2文字相关属性7.7.3绘制轮廓文字7.7.4测量文字宽度7.8操作与使用图像西北师范大学计算机专业课程教学大纲77.8.1向Canvas中引入图像7.8.2改变图像大小7.8.3创建图像切片第8章HTML5音频与视频教学要点：使学生对于音频编解码器和视频编解码器进行了解，熟悉在HTML5页面文档中对于音频和视频的控制与播放。教学时数：4学时教学内容：8.1HTML5多媒体技术概述8.1.1关于编解码器8.1.2音频编解码器8.1.3视频编解码器8.2浏览器支持概述8.2.1用JavaScript检测音频格式支持情况8.2.2用JavaScript检测视频格式支持情况8.3在HTML5中播放音频8.3.1认识audio元素8.3.2播放音频8.4在HTML5中播放视频8.4.1认识video元素8.4.2播放视频8.5音频与视频相关属性、方法与事件8.5.1音频与视频相关属性8.5.2音频与视频相关方法8.5.3音频与视频相关事件第9章Web存储教学要点：使学生重点掌握WebStorage和WebSQL的使用。教学时数：4学时教学内容：9.1认识WebStorage9.1.1Cookie存储机制的优缺点9.1.2为什么要用WebStorage9.1.3WebStorage的优缺点9.1.4浏览器支持概述9.2使用WebStorage9.2.1检查浏览器的支持性9.2.2设置和获取数据9.2.3防止数据泄露9.2.4WebStorage的其他用法9.2.5WebStorage事件监测9.2.6实例1：设计网页皮肤西北师范大学计算机专业课程教学大纲89.2.7实例2：跟踪localStorage数据9.2.8实例3：设计计数器9.2.9综合应用：Web应用项目实时跟踪9.3WebSQL数据库9.3.1WebSQL数据库概述9.3.2使用WebSQL数据库9.3.3实例1：创建简单的本地数据库9.3.4实例2：批量存储本地数据9.3.5综合应用：WebStorage和WebSQL混合开发第10章离线应用教学要点：使学生掌握如何搭建离线应用程序、进行离线缓存更新实现、JavaScript接口实现与离线存储事件监听。教学时数：2学时教学内容：10.1HTML5离线应用概述10.1.1为什么要学习HTML5离线应用10.1.2浏览器支持概述10.2HTML5离线应用详解10.2.1解析manifest文件10.2.2搭建离线应用程序10.2.3检查浏览器是否支持10.2.4离线缓存更新实现10.2.5JavaScript接口实现10.2.6离线存储事件监听10.3实战1：缓存首页10.4实战2：离线编辑内容10.5实战3：离线跟踪第11章Workers多线程处理教学要点：使学生重点掌握创建WebWorkers和与WebWorkers通信的方法。教学时数：2学时教学内容：11.1认识WebWorkers11.1.1WebWorkers概述11.1.2浏览器支持概述11.1.3熟悉WebWorkers成员11.2使用WebWorkers11.2.1检查浏览器支持性11.2.2创建WebWorkers11.2