《交互式前端开发实践》课程标准(修订版)精心总结

1、生活不会辜负努力的人LMVkRSI 1 Y FOR 忤（：11NI E（：H N O 、S I C H LI A N课程标准（2018年秋季学期）课程名称（全称）：课程代码:课程计划总学时:96本学期学时：96互联网+学院教研室：软件教研室2018 年 7 月 20日交互式网站前端开发综合实践院:师:期:四川科技职业学院教学事业部制2018年7月20日交互式网站前端开发综合实践课程标准课程基本信息课程编号考核方式考查课程名称交互式网站前端开发综合 实践课程类别专业必须，理论+实践学时/学分96/6先修课程HTML网页设计等后续课程PHP或 ASP.NET等适用专业软件技术（java开发）、计算

2、机网络技术（Web前端开发）开课学院或教研室互联网+学院执笔苏绍培审核日期年 月审定日期年 月、本课程的性质、定位与任务（一）课程性质本课程是软件技术、计算机网络技术（Web前端开发）等专业方向的专业课程，是该专业的一门必修课。（二）课程定位定位于WEE技术开发工作岗位。 它是WEB前端技术开发的必备课程，在整个课程体系中具有重要的作用。本课程的前导课程：静态网页设计、DIV+CSS布局。后续课程：PHP动态JavaScri pt禾口但不包含任何网页设计、AS P.NET动态网页设计等。（三）课程任务本课程任务是培养网页设计、网页美工以及 WEB综合开发的初、中级专业人才，通过本课程的学习，学

3、生能掌握JavaScri pt 语言的基本编程思想，并能熟练利用JQuery控制WE颐面各级元素，实现 WEB前端的验证、动态展示等任务。二、本课程的教学目标（一）思想教育目标培养面向“互联网+”经济发展需要，拥护党的基本路线，适应生产、建设、务第一线需要的德、智、体、美等方面全面发展的高素质技术技能型人才。（二）知识教学目标能制作包含客户端验证、具有常见动态效果、界面美观大方的商业网站,服务器端脚本。包含的知识点如下:（1） CSS3布局及美化;(3)会使用jQuery美化网页；(4)实现客户端表单校验；）技能教学目标(1)CSS3布局及美化(2)会使用 JavaScript+JQuery设

4、置网页动画效果(3)会使用 JavaScript+JQuery设置网页验证效果(4)会使用 JavaScript+JQuery设置表单特效会使用JavaScript 美化网页;(2)（四）职业素质拓展目标（1）主动学习的能力分析问题的能力 团队协作的能力 交流与沟通能力本课程的考核方式：考查课 成绩比例：满分100分，平时成绩50% +综合作业成绩50%平时成绩：满分 50分，出勤20% +实训80%综合作业成绩：满分 50分，以综合设计的形式进行考核考查原则：突出实践性和实用性，重在考察学生基于交互设计的案例制作能力四、教材及参考书教材：交互式 WEB前端开发实践：冷亚洪等，清华大学出版社2

5、018.7第1版2018.4 第参考教材：1.JavaScript+ jQuery WEB 交互程序设计，李妍等，清华大学出版社,2.Web设计与前端开发秘籍：JavaScript & jQuery 交互式 Web前端开发达科特主编，清华大学出版社 2015年6月第1版五、本课程的教学内容、基本要求及学时分配（一）学时分配教学内容学时数理论实践合计绪论课程定位与作用202第一章HTML标记2810第二章JavaScript编程基础4812第三章JavaScript高级编程4812第四章JQuery编程4812第五章CSS样式运用066人人,、 :第八早表单验证技术066第七章客户端数据请求技术

6、246第八章综合案例网站制作42428机动复习答疑202合计学时247296（二）教学内容及基本要求教学单元或项目教学内容教学要求教学手段参考学时理论实践绪论课程定位与作用了解本课程在课程体系中的定位 与作用理论讲授、多 媒体演示20第一章HTML标记掌握HTML、HTML 5标签、属性多媒体演示、 实验操作28第二章JavaScript编程基础掌握JS常用编辑器；掌握脚本结 构、基本语法与自定义函数多媒体演示、 实验操作48第三章JavaScript高级编程熟练掌握 Dom模型的方法及属 性；掌握使用DOM模型层次关系 访问元素；熟练掌握表单时间和 脚本函数实现表单验证等多媒体演示、 实验操

7、作48第四章JQuery编程掌握JQuery选择器、动态添加事 件和动画设计的技巧多媒体演示、 实验操作48第五章CSS样式运用掌握Style样式等相关特效的制作多媒体演示、 实验操作06人人, 、 :第八早表单验证技术掌握表单事件应用技巧；掌握控 件联动的技巧；掌握表单验证高级特效多媒体演示、 实验操作06第七章客户端数据请求技术掌握XML文件应用；掌握 Ajax 技术应用多媒体演示、 实验操作24第八章综合案例网站制作掌握系统需求设计；掌握数据库 设计；掌握综合开发技巧多媒体演示、 实验操作424机动复习答疑讨论20六、教学质量控制（一）教学重点、难点及教学设计绪论课程定位与作用教学重点：

8、本课程在该专业课程体系中的作用教学难点：课程意义及建议如何学习本章采用多媒体演示及讨论形式进行授课，拟达到让学生充分了解本课程所学知识范围及特定就业岗位对知识需求的效果 第一章HTML标记教学重点：HTML XHTML HTML5标签的使用HTML5、教学难点：HTML5表单控件、画布功能使用 本章采用多媒体演示、讨论及实验操作形式进行授课，拟达到让学生了解理解HTML XHTML HTML5异同、掌握HTML5表单标签及属性、 掌握HTML5音频、视频、 画布运用效果第二章 JavaScript 编程基础教学重点： JavaScript 的基本语法、自定义函数的使用到让学生 了 解教学难点：

9、自定义函数参数的传递方法 本章 采用多媒 体演示 、讨论 及实验操 作形式进行授 课 ，拟达JavaScript 简介、理解 JavaScript 常用编辑器、掌握脚本的基本结构 掌握基本语法、掌握高级语法自定义函数等效果 第三章 JavaScript 高级编程教学重点：运用 DOM模型查找某个 HTML元素；使用Window对象的 作各种样式的广告窗口；使用（Script 标签 ） 、open ()方法制Window 对象的 SetTimeout ()方法和 Date 对象制作日期显示效果；document 对象 getElementBylD ()、getElementName ()方法的应

10、用；内 置对象的应用。教学难点： SetTimeout ()方法的运用；带关闭按钮浮动窗口的制作；面向对象编 程；本章采用多媒体演示、 讨论及实验操作等形式进行授课， 拟达到让学生掌握运用 DOM模型查找某个 HTML元素、掌握使用 Window对象的open ()方法制作各种样式的广告 窗口、掌握使用 Window 对象的 SetTimeout ()方法和 Date 对象制作日期显示效果的 效果；掌握使用 document 对象的 getElementBylD ()方法访问 DlV 层对象、掌握使用 document 对象的 getElementByName ()方法访问表单元素、掌握使用

11、DlV 对象的样式 属性控制层的隐藏和显示的效果。第四章 JQuery 编程教学重点： JQuery 动画的设计教学难点： JQuery 选择器的使用、 Ajax 方法与事件本章采用多媒体演示、 讨论及实验操作等形式进行授课， 拟达到让学生掌握 JQuery 选择器的使用、掌握 JQuery动态添加事件、掌握 JQuery动画的设计的效果 第五章 CSS 样式运用教学重点： 样式特效的实现思路； 常见的 borderColor 、 src 、 className、 display 、backlmage 样式属性教学难点：CSS3动画；“点卡”中多个层切换的效果制作；本章采用多媒体演示、讨论及实

12、验操作等形式进行授课，拟达到让学生掌握使用/ 显示和切换特效的效果style 样式属性动态改变边框颜色、 掌握使用 className 类名属性动态改变按钮背景图 片、掌握使用 display 显示属性实现层或图片的隐藏第六章 表单验证技术教学重点：表单验证的思路；字符串对象的常用属性和方法；文本框控件的常用属性、方法、事件教学难点：电子邮件格式的验证、事件运用、联动验证；本章采用多媒体演示、 讨论及实验操作等形式进行授课， 拟达到让学生掌握使用 DOM模型的层次关系访问元素、掌握使用表单事件和脚本函数实现表单验证、掌握使用String 对象和文本框控件常用属性和方法实现客户端验证的效果；使用

13、提交方法实现 图片代替“提交按钮”的功能、 掌握使用下拉列表框控件实现省市及联功能；掌握使用DIV 的 innerHtml 或 InnerText 动态显示内容的效果第七章 客户端数据请求技术教学重点：认识 Web Service;XML;Ajax教学难点：编写应用 XML Ajax、JSON技术；XML本章采用多媒体演示、讨论及实验操作等形式进行授课，拟达到让学生掌握使用掌握 文件应用；掌握 Ajax、JSON技术应用；第八章 综合案例网站制作 教学重点：项目需求分析编写、页面布局、数据库设计 教学难点：数据库设计、程序设计 本章采用多媒体演示、讨论及实验操作等形式进行授课，拟达到让学生掌握系统需求设计；掌握数据库设计；掌握综合开发技巧二）教学过程评价教学过程评价采取理论与实践相结合， 把学生对知识技能掌握能力的评价与知识点考核相结合。过程评价从学生考勤、课堂讨论、回答问题、课后完成作业、预习、课堂教师评价相实践、 综合实践等方面整体进行评价。评价方式包括学生自评、学生互评、结合的方式进行。（三）课程考核方式及成绩评定 1考核方式 本课程以项目形式考核，要求学生提交针对某网站效果设计的一套完整方案，提交设计方案和项目作品。2成绩评