第5章 jQuery & EasyUI
教学要求
(1) 熟练掌握:JDK、Eclipse jee的下载安装和使用
(2) 熟练掌握:Jsp的语法
(3) 理解Jsp的内置对象和用途
延伸阅读
5.1 初识jQuery
jQuery历史 1.x 2.x 3.x
- jQuery 1.0(2006年8月)1.x 支持IE6-8
- jQuery 1.4.2(2010年2月20日)1.4.2一般功能够而且稳定,体积为71K
- jQuery 1.7.1(2011年11月22日)常用1.4.2和1.7.1
- jQuery 1.9.1(2012年11月14日)
- jQuery 1.12.4(2016年5月20日)
- jQuery 2.0(2013年4月18日)不再支持IE6-8
- jQuery 2.2.4(2016年5月20日)
- jQuery 3.0(2016年6月11日)不再支持IE6-8,运行在Strict Mode下
- jQuery 3.3.1(2018年1月21日)
5.2 jQuery HTML操作
【例2.7】元素宽度与高度[width()、height()、innerWidth()、innerHeight()、outerWidth()、outerHeight()] (WebContent\ch05_du\jq_du_27_000.html)
5.3 jQuery遍历DOM树(向上、向下、水平、过滤)
5.4 jQuery AJAX
/ch05_du/ajaxGet.jsp
/ch05_du/ajaxPost.jsp
5.5 jQuery EasyUI
jQuery Easy UI历史
- jQuery Easy UI 1.1(2010年5月19日)-- jQuery-1.4.2
- jQuery Easy UI 1.2(2010年8月18日)-- jquery-1.4.2.
- jQuery Easy UI 1.3(2012年7月26日)-- jquery-1.7.2
- jQuery Easy UI 1.4(2014年8月1日)-- jQuery v1.11.1
- jQuery Easy UI 1.4.5(2016年3月18日)-- jQuery v1.11.3
- jQuery Easy UI 1.5(2016年7月31日)-- jQuery v1.11.3
jQuery Easy UI从1.3.3到现在的最新版本1.3.4都是基于jQuery2.0的,而jQuery2.0是不支持IE6、7、8的了,所以jQueryEasyUI1.3.3后的版本都不支持IE6、7、8。如果想继续兼容IE8以前的版本,只能使用
一些著名的web客户端框架
- Framework7
- Framework7 是一个开源免费的框架可以用来开发混合移动应用(原生和HTML混合)或者开发 iOS & Android 风格的WEB APP。也可以用来作为原型开发工具,可以迅速创建一个应用的原型。
Framework7 最主要的功能是可以使用HTML、CSS和JS来开发iOS7应用。Framework7 是完全免费开源的。
Framework7 并不能兼容所有的设备。她只专注于为 iOS 和 Google Material 设计提供最好的体验。
如果你想开发 iOS 或者 Android 混合应用(Phonegap)或者你想开发 iOS 和 Google Material 风格的WEB APP,那么Framework7将会是你的首选。
- SUI Mobile
- 超SUI Mobile 是一套基于 Framework7 开发的UI库。它非常轻量、精美,只需要引入我们的CDN文件就可以使用,并且能兼容到 iOS 6.0+ 和 Android 4.0+,非常适合开发跨平台Web App。
SUI Mobile非常轻量,核心库压缩Gzip后的JS、CSS网络传输体积总共只有52K,却提供了20+个常用的组件。
对于只有HTML&CSS的组件,你只需要复制HTML代码既可以使用。他的大部分JS组件都是独立的 Zepto 插件,并且提供了 Zepto/jQuery 风格的API,你将会非常熟悉这种方式。
- Ionic
- Ionic(ionicframework)一款接近原生的Html5移动App开发框架
通过SASS构建应用程序,它提供了很多UI组件来帮助开发者开发强大的应用。它使用JavaScript MVVM框架和AngularJS来增强应用。提供数据的双向绑定,使用它成为Web和移动开发者的共同选择。
- Mobile Angular UI
- Mobile Angular UI 是一个类似 jQuery Mobile 的库. 如果你用过 Angular JS and Bootstrap 会很容易上手 !
- MiniUI
- MiniUI专业WebUI控件库、快速开发,减少50%代码量
丰富组件库,高性能、低内存
支持Java、.NET、PHP和IE6+、FireFox、Chrome
【例5.2】 教务微信平台主控界面(WebContent\ch05_du\52_index_000.html)
【例5.3】班级列表界面(WebContent\ch05_du\53_classList_000.html)
【例5.4】学生列表界面(WebContent\ch05_du\54_studentList_000.html)
【例5.5】班级管理界面(WebContent\ch05_du\55_classMana_000.html)
【例5.6】学生管理界面(WebContent\ch05_du\56_studentMana_000.html)
5.6 习题
1.填空题(概念、知识点----------讲义中醒目的关键字)
(1)
(2)
(3)
(4)
(5)
(6)
(7)
3.编程题
(1) 仿照【例题2】jsp+javabean+servlet+jdbc的【图书管理系统】应用
返回目录