《交互式前端开发实践》课程标准.docx

课 程 标 准（ 2018 年 秋 季学期）课程名称（全称）：交互式网站前端开发综合实践课 程 代 码：课程计划总学时：96本学期学时：96所 属 学 院：互联网+学院教研室：软件教研室任 课 教 师：制 订 日 期：2018年 7 月 20 日四川科技职业学院教学事业部 制2018年7月20日 交互式网站前端开发综合实践课程标准课程基本信息课程编号考核方式 考查课程名称交互式网站前端开发综合实践课程类别专业必须，理论+实践学时/学分96/6先修课程HTML网页设计等后续课程PHP或ASP.NET等适用专业软件技术（java开发）、计算机网络技术（Web前端开发）开课学院或教研室互联网+学院执笔 苏绍培审核日期年 月 审定日期年 月 一、本课程的性质、定位与任务（一）课程性质本课程是软件技术、计算机网络技术（Web前端开发）等专业方向的专业课程，是该专业的一门必修课。（二）课程定位定位于WEB技术开发工作岗位。它是WEB前端技术开发的必备课程，在整个课程体系中具有重要的作用。本课程的前导课程：静态网页设计、DIV+CSS布局。后续课程：PHP动态网页设计、ASP.NET动态网页设计等。（三）课程任务本课程任务是培养网页设计、网页美工以及WEB综合开发的初、中级专业人才，通过本课程的学习，学生能掌握JavaScript语言的基本编程思想，并能熟练利用JavaScript和JQuery控制WEB页面各级元素，实现WEB前端的验证、动态展示等任务。二、本课程的教学目标（一）思想教育目标培养面向“互联网+”经济发展需要，拥护党的基本路线，适应生产、建设、管理、服务第一线需要的德、智、体、美等方面全面发展的高素质技术技能型人才。（二）知识教学目标能制作包含客户端验证、具有常见动态效果、界面美观大方的商业网站，但不包含任何服务器端脚本。包含的知识点如下：（1） CSS3布局及美化；（2） 会使用JavaScript美化网页；（3） 会使用jQuery美化网页；（4） 实现客户端表单校验；（三）技能教学目标（1） CSS3布局及美化（2） 会使用JavaScript+JQuery设置网页动画效果（3） 会使用JavaScript+JQuery设置网页验证效果（4） 会使用JavaScript+JQuery设置表单特效（四）职业素质拓展目标（1）主动学习的能力（2）分析问题的能力（3）团队协作的能力（4）交流与沟通能力三、本课程的考核方式： （1）考查课（2）成绩比例：满分100分，平时成绩50% + 综合作业成绩50%（3）平时成绩：满分50分，出勤20% + 实训80%（4）综合作业成绩：满分50分，以综合设计的形式进行考核（5）考查原则：突出实践性和实用性，重在考察学生基于交互设计的案例制作能力四、教材及参考书教材：交互式WEB前端开发实践：冷亚洪等，清华大学出版社 2018.7第1版参考教材：1.JavaScript+ jQuery WEB交互程序设计，李妍等，清华大学出版社，2018.4 第1版2.Web设计与前端开发秘籍：JavaScript & jQuery 交互式Web前端开发达科特主编，清华大学出版社 2015年6月第1版五、本课程的教学内容、基本要求及学时分配（一）学时分配教学内容学时数理论实践合计绪 论课程定位与作用202第一章HTML标记2810第二章JavaScript编程基础4812第三章JavaScript高级编程4812第四章JQuery编程4812第五章CSS样式运用066第六章表单验证技术066第七章客户端数据请求技术246第八章综合案例网站制作42428机动复习答疑202合计学时 24 72 96（二）教学内容及基本要求教学单元或项目教学内容教学要求教学手段参考学时理论实践绪论课程定位与作用了解本课程在课程体系中的定位与作用理论讲授、多媒体演示20第一章HTML标记掌握HTML、HTML5标签、属性多媒体演示、实验操作28第二章JavaScript编程基础掌握JS常用编辑器；掌握脚本结构、基本语法与自定义函数多媒体演示、实验操作48第三章JavaScript高级编程熟练掌握Dom模型的方法及属性；掌握使用DOM模型层次关系访问元素；熟练掌握表单时间和脚本函数实现表单验证等多媒体演示、实验操作48第四章JQuery编程掌握JQuery选择器、动态添加事件和动画设计的技巧多媒体演示、实验操作48第五章CSS样式运用掌握Style样式等相关特效的制作多媒体演示、实验操作06第六章表单验证技术掌握表单事件应用技巧；掌握控件联动的技巧；掌握表单验证高级特效多媒体演示、实验操作06第七章客户端数据请求技术掌握XML文件应用；掌握Ajax技术应用多媒体演示、实验操作24第八章综合案例网站制作掌握系统需求设计；掌握数据库设计；掌握综合开发技巧多媒体演示、实验操作424机动复习答疑讨论20六、教学质量控制（一）教学重点、难点及教学设计绪论 课程定位与作用教学重点：本课程在该专业课程体系中的作用教学难点：课程意义及建议如何学习本章采用多媒体演示及讨论形式进行授课，拟达到让学生充分了解本课程所学知识范围及特定就业岗位对知识需求的效果第一章 HTML标记教学重点：HTML、XHTML、HTML5标签的使用教学难点：HTML5表单控件、画布功能使用本章采用多媒体演示、讨论及实验操作形式进行授课，拟达到让学生了解HTML5、理解HTML、XHTML、HTML5异同、掌握HTML5表单标签及属性、掌握HTML5音频、视频、画布运用效果第二章 JavaScript编程基础教学重点：JavaScript的基本语法、自定义函数的使用教学难点：自定义函数参数的传递方法本章采用多媒体演示、讨论及实验操作形式进行授课，拟达到让学生了解JavaScript简介、理解JavaScript常用编辑器、掌握脚本的基本结构(Script标签)、掌握基本语法、掌握高级语法自定义函数等效果第三章 JavaScript高级编程教学重点：运用DOM模型查找某个HTML元素；使用Window对象的open（）方法制作各种样式的广告窗口；使用Window对象的SetTimeout（）方法和Date对象制作日期显示效果；document对象getElementByID（）、getElementName（）方法的应用；内置对象的应用。教学难点：SetTimeout（）方法的运用；带关闭按钮浮动窗口的制作；面向对象编程；本章采用多媒体演示、讨论及实验操作等形式进行授课，拟达到让学生掌握运用DOM模型查找某个HTML元素、掌握使用Window对象的open（）方法制作各种样式的广告窗口、掌握使用Window对象的SetTimeout（）方法和Date对象制作日期显示效果的效果；掌握使用document对象的getElementByID（）方法访问DIV层对象、掌握使用document对象的getElementByName（）方法访问表单元素、掌握使用DIV对象的样式属性控制层的隐藏和显示的效果。第四章JQuery编程教学重点：JQuery动画的设计教学难点：JQuery选择器的使用、Ajax方法与事件本章采用多媒体演示、讨论及实验操作等形式进行授课，拟达到让学生掌握JQuery选择器的使用、掌握JQuery动态添加事件、掌握JQuery动画的设计的效果第五章 CSS样式运用教学重点：样式特效的实现思路；常见的borderColor、src、className、display、backImage样式属性教学难点：CSS3动画；“点卡”中多个层切换的效果制作；本章采用多媒体演示、讨论及实验操作等形式进行授课，拟达到让学生掌握使用style样式属性动态改变边框颜色、掌握使用className类名属性动态改变按钮背景图片、掌握使用display显示属性实现层或图片的隐藏/显示和切换特效的效果第六章 表单验证技术教学重点：表单验证的思路；字符串对象的常用属性和方法；文本框控件的常用属性、方法、事件教学难点：电子邮件格式的验证、事件运用、联动验证；本章采用多媒体演示、讨论及实验操作等形式进行授课，拟达到让学生掌握使用DOM模型的层次关系访问元素、掌握使用表单事件和脚本函数实现表单验证、掌握使用String对象和文本框控件常用属性和方法实现客户端验证的效果；使用提交方法实现图片代替“提交按钮”的功能、掌握使用下拉列表框控件实现省市及联功能；掌握使用DIV的innerHtml或InnerText动态显示内容的效果第七章 客户端数据请求技术教学重点：认识Web Service;XML;Ajax教学难点：编写应用XML、Ajax、JSON技术；本章采用多媒体演示、讨论及实验操作等形式进行授课，拟达到让学生掌握使用掌握XML文件应用；掌握Ajax、JSON技术应用；第八章 综合案例网站制作教学重点：项目需求分析编写、页面布局、数据库设计教学难点：数据库设计、程序设计本章采用多媒体演示、讨论及实验操作等形式进行授课，拟达到让学生掌握系统需求设计；掌握数据库设计；掌握综合开发技巧（二）教学过程评价教学过程评价采取理论与实践相结合，把学生对知识技能掌握能力的评价与知识点考核相结合。过程评价从学生考勤、课堂讨论、回答问题、课后完成作业、预习、课堂实践、综合实践等方面整体进行评价。评价方式包括学生自评、学生互评、教师评价相结合的方式进行。（三）课程考核方式及成绩评定1考核方式本课程以项目形式考核，要求学生提交针对某网站效果设计的一套完整方案，提交设计方案和项