第六章计算机数据库技术+jquery及应用.pptVIP

第六章 JQuery及应用 一、什么是JQuery jQuery 是一个 JavaScript 库。 jQuery 极大地简化了 JavaScript 编程。 jQuery 很容易学习。 jQuery 是一个“写的更少，但做的更多”的轻量级 JavaScript 库。 jQuery 库 - 特性 HTML 元素选取 HTML 元素操作 CSS 操作 HTML 事件函数 JavaScript 特效和动画 HTML DOM 遍历和修改 AJAX Utilities 二、添加JQuery库 JQuery官网：http://jQ/ 引用jQuery库：在家head中添加台下代码，引用jQuery库。 script src=../Scripts/jquery-1.9.1.min.js type=text/javascript/script src=/ajax/libs /jquery/1.4.0/jquery.min.js /ajax/jquery /jquery-1.4.min.js jQuery库文件说明 jquery-x.x.x.min.js：压缩版，x.x.x为版本号 jquery-1.9.1.js：无压缩版 jQuery示例 三、jQuery语法 基础语法是：$(selector).action() 美元符号定义 jQuery 选择符（selector）“查询”和“查找” HTML 元素 jQuery 的 action() 执行对元素的操作 示例： $(“p”).show(); //隐藏所有p元素 $(“p”).hide(); //显示所有p元素 $(this).hide() // 隐藏当前元素 $(“#first”).show(); //显示id为first的元素 文档就绪函数 $(document).ready( //资料文档已就绪 function(){ //定义处理函数 --- jQuery functions go here ---- } ); 五、jQuery 选择器 jQuery 元素选择器：使用 CSS 选择器来选取 HTML 元素 。”css选择器” jQuery 属性选择器：使用 XPath 表达式来选择带有给定属性的元素 。”[属性表达式]” jQuery CSS 选择器：?CSS 选择器可用于改变 HTML 元素的 CSS 属性 选择器示例 遍历 jQuery 遍历，意为“移动”，用于根据其相对于其他元素的关系来“查找”（或选取）HTML 元素。以某项选择开始，并沿着这个选择移动，直到抵达您期望的元素为止。 通过 jQuery 遍历，您能够从被选（当前的）元素开始，轻松地在家族树中向上移动（祖先），向下移动（子孙），水平移动（同胞）。这种移动被称为对 DOM 进行遍历。 向上遍历 DOM 树 它们用于向上遍历 DOM 树： parent() ：返回父结点 parents() ：返回返回祖先结点 parentsUntil() ：返回由指定结点之祖先结点 向下遍历 DOM 树 children() ：返回被选元素的所有直接子元素。 find() ：返回被选元素的后代元素，一路向下直到最后一个后代。 在 DOM 树中水平遍历 siblings() next() nextAll() nextUntil() prev() prevAll() prevUntil() 缩写搜索元素的范围 first() last() eq() filter() not() * *