JQuery入门与进阶.ppt

《JQuery入门与进阶.ppt》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、2021/9/29InspurgroupJquery入门与进阶目录一、简介二、使用与版本三、常用方法四、插件扩展JQuery简介JQuery是免费、开源的，使用MIT许可协议。JQuery是一个兼容多浏览器的javascript框架，它是轻量级的js库，兼容CSS3，核心理念是writeless，domore(写得更少,做得更多)。JQuery的语法设计可以使开发者更加便捷，例如操作文档对象、选择DOM元素、制作动画效果、事件处理、使用Ajax以及其他功能。http://jquery.com/JQuery简介jQuery包含以下特点：1.动态特效2.AJAX3.通过插件来扩展、成熟插

2、件，模块化4.方便的工具-例如浏览器版本判断5.渐进增强6.链式调用7.多浏览器支持，支持InternetExplorer6.0+、Opera9.0+、Firefox2+、Safari2.0+、Chrome1.0+（在2.0.0中取消了对InternetExplorer6,7,8的支持）8.文档齐全、资源丰富9.支持html内容分离，只需要定义ID即可JQuery简介入门实例：$("#test").hide()JQuery的hide()函数，隐藏id="test"的元素。$(“img”).after(“After”)在图片后面添加文本。$(‘#myDiv’).load(

3、‘/jquery/test1.txt’);通过AJAX改变文本。目录一、简介二、使用与版本三、常用方法四、插件扩展JQuery使用与版本目前包括两个大版本1.xx.xx和2.xx.xx。特别注意：JQuery2.0及后续版本将不再支持IE6/7/8浏览器。推荐版本：jquery-1.8.3（*min.js代表js文件已经被压缩，文件更小、更快）/oa_code/skins/dcwork/common/jquery-1.8.3.min.js目录一、简介二、使用与版本三、常用方法1.核心2.选择器3.属性4.筛选5.文档处理四、插件扩展6.CSS7.事件8.效果9.Ajax10.工具常用

4、方法－核心jQuery(html)根据提供的原始HTML标记字符串，动态创建由jQuery对象包装的DOM元素。jQuery(elements)将一个或多个DOM元素转化为jQuery对象。jQuery(callback)$(document).ready()的简写（当DOM加载完成后要执行的函数）。注意：$()=jQuery()$号是jQuery“类”的一个别称。例：动态创建一个div元素（以及其中的所有内容），并将它追加到body元素中。$("

5、nts).hide()当DOM加载完成后，执行其中的函数。$(function(){//文档就绪});目录一、简介二、使用与版本三、常用方法1.核心2.选择器3.属性4.筛选5.文档处理四、插件扩展6.CSS7.事件8.效果9.Ajax10.工具常用方法－选择器基本$("*")匹配所有元素$(".myClass")查找所有类是"myClass"的元素$("div")根据给定的元素名匹配所有元素$("#myDiv")查找ID为"myDiv"的元素$("div,span,p.myClass")将每一个选择器匹配到的元素合并后一起返回层级$("forminput")找到表单中所有的inp

6、ut元素（含多级）$("form>input")找到表单中所有的子级input元素（仅子级）$("label+input")匹配所有跟在label后面的input元素$("form~input")找到所有与form同辈的input元素常用方法－选择器属性$(“tr:eq(1)”)匹配一个给定索引值的元素（查找第二行）$(“tr:first”)匹配找到的第一个元素（查找表格的第一行）$(“tr:last”)匹配找到的最后一个元素（查找表格的最后一行）$(“input:not(:checked)”)去除所有与给定选择器匹配的元素（查找所有未选中的input元素）内容$("div:cont

7、ains('John')")匹配包含给定文本的元素可见性$("tr:hidden")查找所有不可见的tr元素$("tr:visible")查找所有可见的tr元素查找所有可见的tr元素常用方法－选择器属性$(“tr:eq(1)”)匹配一个给定索引值的元素（查找第二行）$(“tr:first”)匹配找到的第一个元素（查找表格的第一行）$(“tr:last”)匹配找到的最后一个元素（查找表格的最后一行）$(“input:not(:checked)”)去除所有与给