《jQuery网页特效设计基础教程--第10章-jQuery性能优化与技巧-教案.docx》由会员分享,可在线阅读,更多相关《jQuery网页特效设计基础教程--第10章-jQuery性能优化与技巧-教案.docx(4页珍藏版)》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、第10章jQuery性能优化与技巧课程名称jQuery网页特效设计基础教程项目名称jQuery性能优化与技巧任务名称jQuery性能优化与技巧课时2项目性质演示性 验证性 设计性 4综合性授课班级授课日期授课地点教学目标能力目标:1 .具备使用jQuery中常用的性能优化技术的能力2 .具备使用常用的jQuery技巧的能力知识目标:1 .掌握使用jQuery过程中常用的性能优化技术2 .掌握常用的jQuery技巧素质目标:1 .培养学生信息搜集能力2 .培养学生团结合作、互帮互助的能力教学内容1 .任务描述2 .任务展示与实现(1)练习使用常用的jQuery性能优化技术(2)联系使用jQuer
2、y的常用技巧(2)学生动手操作3 .教师讲解本任务涉及的知识点4 .任务小结教学重点1 .常用的jQuery性能优化技术2 . jQuery的常用技巧3 .编写jQuery代码教学难点1. jQuery的常用技巧教学准备1 .装有jQuery的电脑2 .教学课件PPT3 .教材:jQuery网页特效设计基础教程(慕课版)刘刚 人民邮电出版社作业设计1 .使用jQuery实现图片的预加载2 .检测浏览器是否为IE 10浏览器3 .切换ID与class教学过程孵教学内容与过程(教学内容、教学方法、组织形式、教学手段)前组织做好课前“5分钟”教学管理(多媒体、实训室),做好上课前的各项准备工作(打开
3、电脑、打开 课件、打开软件、打开U盘中的素材位置、打开授课计划、教案等),吸引学生注意力。濡呈蹒【课前说明】本章主要介绍了 jQuery使用过程中常用的性能优化及技巧。使开发人员有效利用jQuery使网站 达到最佳性能。【目的】使学生从了解本单元的学习目标、学习重点、考评方式等方面明确学习本单元知识的要求和目标。谢呈一、关键知识点内容 (1)定义jQuery变量时,应添加一个$符号到变量前。描述 (2)有必要时可以在jQuery代码中使用原生的JavaScript函数,这样能获得更好的性能。(3)经常标准化jQuery代码,可以查询哪个比较慢,然后替换它。可以用Firebug控制台,也 可以使
4、用jQuery的快捷函数使测试变得更容易。(4)如果使用版本比较新的jQuery类库,请使用.on,其他任何方法都是最终使用on来实现的。(5)在jQuery中最快的选择器是ID选择器,因为它直接来自于JavaScript的getElement Byld() 方法。(6) jQuery中第二快的选择器是tag选择器(如$(head),因为它直接来自于原生的JavaScript 方,法 getElementsByTagName() o(7)可以扩展jQuery 的$.expr:r|对象,编写适合自己的选择器。(8)在jQuery中,使用内部函数data。存储信息,性能更好。(9)通过为HTML添
5、加“JS”的class,可以启用JavaScript,而只有当JavaScript启用时,才可 以将整个HTML内容隐藏起来,用jQuery来实现指定的功能(例如:收起某些面板或当用户单击它 们时展开)。(10)通过将jQuery函数绑定到$(window)oad事件的方法,可以减少页面载入时的CPU使用 率,它会在所有的html (包括iframe)被下载完成后执行。(11)养成将jQuery对象缓存到变量的习惯。(12)在jQuery中应该对直接的DOM操作进行限制,遇到这种情况时,可以首先在内存中创 建需要的内容,然后更新DOM,因为直接的DOM操作速度很慢。案例:LID与Class之间
6、转换$(document).ready(function() function checkWindowSize() if ( $(window).width() 1200 ) $(,body,).addClass(,large,);)else $(,body).removeClass(,large,);)$(window).resize(checkWindowSize););愉1.操作元素样式实VII2 .替换指定元素3 .引用Google主机上的jQuery类库4 .直接给DOM元素添加style标签,的通过学习,学生能够掌握jQuery使用过程中常用的性能优化及技巧。本节课主要运用案例教学法,通过对jQuery使用过程中常用的性能优化及技巧的深入理解,掌 握jQuery使用过程中常用的性能优化及技巧的特点及优势,深入探讨jQuery使用过程中常用的性能 优化及技巧的编程方法,通过实例的方法加强对jQuery使用过程中常用的性能优化及技巧的掌握, 达到能够独立熟练运用jQuery使用过程中常用的性能优化及技巧来解决实际问题的能力。教学评价 方式以小组为单位,以完成案例的质量为评价标准,形成任务驱动,小组协作,质量与速度并存的 课堂评价方式,促进学生的自主、创新学习的方式。