《精通JavascriptJQuery-第10章.pptx》由会员分享,可在线阅读,更多相关《精通JavascriptJQuery-第10章.pptx(13页珍藏版)》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、精通JavaScript+jQuery第10章:jQuery基础jQuery概述jQuery的“$”jQuery与CSS3使用选择器管理选择结果采用jQuery链JQUERYJQUERY概述概述 JQUERY简介简介 jQuery由美国人John Resig于2006年初创建,至今已吸引了来自世界各地的众多javascript高手加入其team,包括来自德国的Jörn Zaeffere,罗马尼亚的Stefan Petre等等。jQuery是一个快速的,简洁的javaScript库,使用户能更方便地处理HTML documents、events、实现动画效果,并且方便地为网站提供AJA
2、X交互。jQuery能够使用户的html页保持代码和html内容分离,也就是说,不用再在html里面插入一堆js来调用命令了,只需定义id即可。能能做什么做什么程序员:简化javascript和ajax编程,能够使程序员从设计和书写繁杂的JS应用中解脱出来,将关注点转向功能需求而非实现细节上,从而提高项目的开发速度。用户:改善了页面视觉效果,增强了与页面的交互性,体验更绚丽的网页物资。主流主流的的JavaScript框架框架YUIDojomooToolsPrototypejQueryMore.性能测试:http:/ 链式语法:$(p.surprise).addClass(ohmy).show(
3、slow);CSS 1-3 选择器:支持CSS选择器选定DOM对象 跨浏览器:支持Internet Explorer 6+、Opera 9+、Firefox 1.5+、Safari 2+简单:较其它JS库更容易入门,中、英文档很齐全 易扩展:JQUERY UI、JQUERY FX 已经有很完善的基于JQUERY的用户界面库 和网页特效库 jQuery下载下载当前版本官方网站下载:http:/ jQuery安装安装在页面头部head中,添加js2.3 MyEclipse中中可以实现可以实现jQuery的智能提示的智能提示 jQueryjQuery的的“$”选择器$(“h2 a”);功能函数前缀$
4、.trim(sString);解决window.onload函数的冲突创建DOM元素自定义添加“$”解决“$”的冲突$(“div p”);jQuery(“div p”);jQueryjQuery与与CSS3CSS3CSS3标准浏览器的兼容性jQuery的引入提供了CSS3标准下的选择器兼容性好使用选择器使用选择器属性选择器$(“ahref=10-9.html”).addClass(“myClass”);包含选择器$(“li:has(a)”)位置选择器$(“p:first-child”)过滤选择器$(“inputname=cbx:checked”)实现反向过滤$(“input:not(:radi
5、o)”)管理选择结果管理选择结果获取元素的个数$(“img”).size()提取元素$(“imgtitle”)1$(“imgtitle”).get(1)添加、删除、过滤元素$(“imgalt”).add(“imgtitle”)将设置了alt属性和title属性的img组合成新数组$(“imgtitle”).not(“title*=isaac”)$(“img”).filter(“title*=isaac”)$(“img title*=isaac”)查询过滤新元素集合$(“p”).find(“span”)$(“span”,$(“p”)采用采用jQueryjQuery链链jQuery的语句可以链接在一起缩短代码的长度实现特殊的效果$(“div”).addClass(“myClass1”).filter(function(index)return index=1|$(this).attr(“id”)=“fourth”;).addClass(“myClass2”);