复旦大学：《高级Web技术》课程教学课件PPT（2011）_05 初识 jQuery

初识 jQuery Edweb TAs 2011.4.19

初识 jQuery Adweb TAs 2011.4.19

什么是 jQuery jQuery是一个快速、简洁的 JavaScript库 Write less do more 帮助开发人员简化: 文档遍历 事件处理 动画 AJAX

什么是 jQuery ▪ jQuery 是一个快速、简洁的 JavaScript 库 ▪ "Write less, do more." ▪ 帮助开发人员简化： ▪ 文档遍历 ▪ 事件处理 ▪ 动画 ▪ AJAX ▪ …

谁在使用 jQuery Google Code Amazon IBM Dell Microsoft 土豆网 豆瓣 CCTV 京东网

谁在使用 jQuery ▪ Google Code ▪ Amazon ▪ IBM ▪ Dell ▪ Microsoft ▪ 土豆网 ▪ 豆瓣 ▪ CCTV ▪ 京东网 ▪ …

为什么要使用 jQuery? Web应用程序界面不断丰富,Web页面 将包含越来越多的 JavaScript代码 基于原生 JavaScript编程过程较为繁琐, 且各浏览器下存在差异 jQuery帮助开发人员简化 JavaScript开 发,提高开发效率

为什么要使用 jQuery？ ▪ Web 应用程序界面不断丰富，Web 页面 将包含越来越多的 JavaScript 代码 ▪ 基于原生 JavaScript 编程过程较为繁琐， 且各浏览器下存在差异 ▪ jQuery 帮助开发人员简化 JavaScript 开 发，提高开发效率

jQuery做了什么 为 JavaScripηt编程提供了通用的抽象层 对多数主流浏览器的兼容 IE 6.0+, FF 2+, Safari 3.0+, Opera 9.0+ Chrome

jQuery 做了什么？ ▪ 为 JavaScript 编程提供了通用的抽象层 ▪ 对多数主流浏览器的兼容 ▪ IE 6.0+, FF 2+, Safari 3.0+, Opera 9.0+, Chrome

jQuery的特点 简单易学的API 精简的体积 当前 Release版本v142最小化且使用 gzIp 压缩后仅24KB 支持CSS3

jQuery 的特点 ▪ 简单易学的 API ▪ 精简的体积 ▪ 当前 Release 版本 v1.4.2 最小化且使用 gzip 压缩后仅 24KB ▪ 支持 CSS3

加载 jQuery 下载到自己的服务器进行部署 OR 使用 Google托管的代码 节省服务器流量 充分利用浏览器缓存 亦可使用 Google AJAX Libraries API进行加载

加载 jQuery ▪ 下载到自己的服务器进行部署 OR ▪ 使用 Google 托管的代码 ▪ 节省服务器流量 ▪ 充分利用浏览器缓存 ▪ 亦可使用 Google AJAX Libraries API 进行加载

jQuery对象 几乎每个 jQuery函数都返回一个 jQuery对 象 每个 jQuery对象包装了若千个DOM元素 “链接性 Java的 String类,多数方法返回 String类型值 String text= new String("Slideshow"). toUpperCaseO substring (0, 5). toLowerCaseO jQuery对象 S(div#slide").add Class("hover").show(). text("Welcome!

jQuery 对象 ▪ 几乎每个 jQuery 函数都返回一个 jQuery 对 象 ▪ 每个 jQuery 对象包装了若干个 DOM 元素 ▪ “链接性” ▪ Java 的 String 类，多数方法返回 String 类型值 String text = new String("Slideshow").toUpperCase().substring(0,5).toLowerCase(); ▪ jQuery 对象 $("div#slide").addClass("hover").show().text("Welcome!");

jQuery能做些什么? 取得文档元素 遍历文档元素 处理元素样式 处理文档内容 响应交互操作 为文档添加动态效果 简化异步请求过程

jQuery 能做些什么？ ▪ 取得文档元素 ▪ 遍历文档元素 ▪ 处理元素样式 ▪ 处理文档内容 ▪ 响应交互操作 ▪ 为文档添加动态效果 ▪ 简化异步请求过程

jQuery能做些什么? 取得文档元素 遍历文档元素 处理元素样式 处理文档内容 响应交互操作 为文档添加动态效果 简化异步请求过程

jQuery 能做些什么？ ▪ 取得文档元素 ▪ 遍历文档元素 ▪ 处理元素样式 ▪ 处理文档内容 ▪ 响应交互操作 ▪ 为文档添加动态效果 ▪ 简化异步请求过程