jQuery.pptx

jQuery 简化的javaScript 目标 使用jQuery获取页面对象 jQuery对象与DOM对象的转换 使用jQuery控制样式 使用jQuery实现相关特效 简介 jQuery是继prototype之后又一个优秀的Javascrīpt框架。它 是轻量级的js库,其兼容CSS3，还兼容各种浏览器，能够使用 户更方便地处理页面文档对象及事件，有助于实现动画效果 及为网站提供AJAX交互。 jQuery的宗旨是write less ,do more jQuery 为什么要学习jQuery? 轻巧方便 强大的选择器 出色的DOM操作的封装 可靠的事件处理机制 出色浏览器兼容性 不污染顶级变量 完善的AJAX 开源 jQuery的使用 jQuery是javaScript封装的类库，并不是新生的语言，所以我们要学习的主要是jQuery获取对象的操作方法 使用jQuery获取对象 var $obj=$(选择器); var $obj=jQuery(选择器); jQuery的使用 jQuery获取对象的方式使用选择器获取，其语法和CSS中选择器的语法相同 选择器 作用 $(“div”) 标签选择器，获取所有div标签对象 $(“#div”) Id选择器，获取id为div的对象 $(“.div”) 类选择器，获取加载了div类样式的标签对象 $(“div img”) 层叠式级联选择器，获取所有div标签中的img标签对象 jQuery的使用 jQuery获取的对象不是DOM对象，也就是说 jQuery获取的对象是封装后的数组对象，可以使用jQuery的方法对其进行操作 $(“#div”)!=document.getElementById(“div”) jQuery的使用 jQuery对象的基本方法和属性 属性 作用 length 获取对象的数量 方法 作用 size() 等同于length get() 获取DOM对象的数组 get(index) == [index] 获取单个DOM对象 html() 获取对象内所有内容 text() 获取对象内文本内容 val() 获取对象的值 each(callback) 遍历数组中的对象 jQuery的使用 jQuery和DOM对象的转换 jQuery对象转为DOM对象： 使用[index] 如：var obj=$(“div”)[0] 获取第一个div 使用get(index) 如：var obj=$(div).get(0) DOM对象转为jQuery对象： var $obj=$(document.getElementById(“obj”)); jQuery的使用 jQuery对于获取对象的筛选 语法 作用 获取父元素内的子元素集合 + 获取指定对象的下一个同级对象 ~ 获取指定对象后的所有同级对象 :first 获取第一个对象 :last 获取最后个对象 :not 对指定属性进行取反获取 jQuery的使用 语法 作用 :even 获取索引值为偶数的对象集合 :odd 获取索引值为奇数的对象集合 :eq 获取指定索引值的对象 :gt 获取大于指定索引值的对象集合 :lt 获取小于指定索引值的对象集合 jQuery的使用 语法 作用 :contains 获取匹配指定文本内容的对象 :empty 获取不包含子元素或文本内容的对象 :has 获取匹配选择器的对象 :parent 获取包含子元素或文本的对象 :hidden 获取隐藏的对象 :visible 获取可见的对象 jQuery的使用 语法 作用 [attribute] 获取指定属性的对象 [attribute=value] 获取指定属性是指定值的对象 [attribute^=value] 获取属性以指定值开始的对象 [attribute$=value] 获取属性以指定值结尾的对象 [attribute*=value] 获取属性中包含指定值的对象 jQuery的使用 表单元素过滤使用：加上表单元素名称即可，如获取表单中的文本框 获取表单中的单选框 var $txt=$(“:text”) var $rdo=$(“form:radio”) jQuery的使用 表单对象具备的属性 属性 作用 :enabled 获取可用对象集合 :disabled 获取不可用对象集合 :checked 获取选中复选框对象 :selected 获取选中option对象 jQuery的使用 jQuery中和属性及定位有关的方法 方法 作用 attr(name) 获取对象指定的属性 attr(key , value) 设置指定属性的值 attr({key : value , key : value}) 批量设置属性的值 attr(key , fu