1_jQuery框架入门基础1.ppt

第一章 jQuery基础 本书介绍 jQuery是继Prototype之后又一个优秀的JavaScript库 是一个由JohnResig创建于2006年1月的开源项目 现在的jQuery团队主要包括核心库 UI和插件等开发人员以及推广和网站设计维护人员 jQuery凭借简洁的语法和跨平台的兼容性 极大地简化了JavaScript开发人员遍历HTML文档 操作DOM 处理事件 执行动画和开发AJAX的操作 其独特而又优雅的代码风格改变了JavaScript程序员的设计思路和编写程序的方式 总之 无论是网页设计师 后台开发者 还是项目管理者 也无论是JavaScript初学者还是JavaScript高手 都有足够多的理由去学习jQuery 目标 jQuery简介编写简单的jQuery程序jQuery对象和DOM对象jQuery中的基本选择器包装集的管理 JQuery简介 jQuery是一套Javascript脚本库 使用jQuery将极大的提高编写javascript代码的效率 让写出来的代码更加优雅 更加健壮 同类JS库 DojoExtjs JQuery的优势 提供了强大的功能函数解决浏览器兼容问题实现丰富的UI丰富的插件 jQuery起步 jQuery特点jQuery强调的理念是写的少 做得多 writeless domore jQuery封装了大量常用的DOM操作jQuery灵活的事件处理机制jQuery中拥有完善的AJAX功能 jQuery的下载和使用 jQuery官方网站 单击页面中的Download jQuery 链接下载该jQuery核心库jQuery不需要安装 把下载的jQuery库放到网站的一个公共位置 想要在某个页面上使用jQuery时 只需要在相关的HTML文档中引入该库文件即可 jQuery基本语法 jQuery基本语法jQuery 选择器 或者 选择器 其中 jQuery是JQuery中的核心对象 是jQuery的简写形式 二者是等价的 选择器 是我们本章讲解的重点 编写简单的jQuery程序 页面加载事件语法格式 两种写法效果一样 和onload的区别window onload方法是在整个页面完全加载之后执行语句 及资源显示完毕之后调用 而jQuery的ready方式仅仅是在DOM对象加载完成后就调用 并且jQuery的ready方法可以指定多次 document ready function 在这里写你的代码 function 在这里写你的代码 jQuery中的链式操作 在jQuery中 通常调用jQuery对象的每一个方法后 都会将该对象作为返回值返回 所以可以使用链式操作 jQuery对象和DOM对象 DOM对象使用JavaScript中的DOMAPI操作获得的元素对象jQuery对象jQuery对象就是通过jQuery包装DOM对象后产生的对象 传统的javascript vardiv document getElementById testDiv vardivs document getElementsByTagName div 获取的Dom对象 JQuery包装集 Dom对象和JQuery包装集 jQuery包装集 varjQueryObject testDiv jQuery对象和DOM对象的转换 jQuery对象转换成DOM对象方法一 jQuery对象转换成DOM对象方法二 DOM对象转换成jQuery对象方法 选择器和包装集 选择器带有特定语法格式的 用于对页面元素进行筛选字符串包装集将选择器所选择的元素封装在一个类似于数组的jQuery对象中 该对象封装了所选择的元素 jQuery中的基本选择器 选择器语法 1 通过ID选取元素语法 id 2 通过类名获取元素语法 className 3 通过标签名获取元素语法 tagName 4 一次性获取多个元素语法 selector1 selector2 select3 确定包装集的大小 1 使用size 方法 2 jQuery元素包装集运行起来与数组非常相似 像JavaScript数组那样拥有length属性 而这个属性的值 就是包装元素的个数 获得元素在包装集中的位置 index element 对包装集进行筛选 对包装集中的元素进行过滤 filter expression 针对的是本身对包装集中的元素进行查找find 针对的是子集获取包装集的子集 slice begin end 总结 jQuery简介编写简单的jQuery程序jQuer