讲义一 jquery简介

《讲义一 jquery简介》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。

1、-讲义一jQuery简介1、jQuery是什么ljQuery是一个快速的，简洁的javaScript库，使用户能更方便地处理HTMLdocuments、events、实现动画效果，并且方便地为网站提供AJAX交互。ljQuery还有一个比较大的优势是，它的文档说明很全，而且各种应用也说得很详细，同时还有许多成熟的插件可供选择。ljQuery能够使用户的html页保持代码和html内容分离，也就是说，不用再在html里面插入一堆js来调用命令了，只需定义id即可。2、jQuery能做什么仅核心特性：l

2、获取页面中的元素l修改页面的外观l改变页面的内容l响应用户的页面操作l为页面添加动态效果l无需刷新页面即可从服务器获取信息JQuery实现的基础效果展示3、jQuery对学习者的基础要求具备基本的html和css知识，并且应该熟悉javascript语法。4、jQuery学习资料（1）官网：http://jQuery.com/API网址：http://api.jQuery.com/提供最新版本jQuery库下载，目前最新v1.8.2。实验用v1.4.2（见jQuery学习资料/js）Baidu（2）

3、安装和其他js文件放在一起即可5、第一个jQuery文档（web文件index.html）（1）演示jQuery效果（引用jQuery核心库、ready()、效果）（2）只使用onload展示效果，并与第一种方式作比较。（3）匿名函数块与有名函数不同。讲义二选择符-取得你想要的一切1、简介jQuery利用了CSS和XPath选择符的能力，让我们在DOM中快捷而轻松地获取元素或元素组。（JQuery最强大的功能之一）通过jQuery对象可以很方便的操纵在页面中找到的元素（修饰、事件触发等）jQue

4、ry对象—DOM中的元素被封装成对象，对这些元素运用一定的方法取得的结果集合也是jQuery对象。2、工厂函数$()$()函数的圆括号中使用的参数几乎没有什么限制。比较常用的例子：$(‘p’)取得文档中的所有段落$(‘#someid’)取得文档中ID为someid的元素$(‘.someclass’)取得文档中带有someclass的所有元素3、CSS选择符---负责任的jQuery开发者应该在编写自己的程序时，始终坚持“progressiveenhancement,gracefuldegradati

5、on”（渐进增强，平稳退化）。做到在javascript禁用时，页面应该能够与启用时一样准确地呈现，即使没有那样美观。实例-----导航结构见网页“CSS选择符-导航菜单”注意：（1）使用$(document).ready()结构时，位于其中的所有代码都会在DOM加载后立即执行。（2）子元素组合符>（3）否定式伪类选择符增加代码“

• 333

6、(‘a[title]’)选择所有带title属性的链接---属性前面不需加@实例----链接显示见网页“CSS选择符-导航菜单”，在其上增加代码//XPath选择$('a[href^="mailto:"]').addClass('mailto');$('a[href$=".pdf"]').addClass('pdflink');$('a[href*="mysite.com"]').addClass('mysite');注意：（1）属性选择符允许使用类似正则表达式的语法来表示字符串的开始（^）和结尾（

7、$），而且使用（*）表示字符串的任意位置。5、自定义选择符例：$(div.horizontal:eq(1))从匹配的带有horizontal类的div集合中，选择第2个项。Javascript采用从0开始的计数方式。实例----前三章实例见网页“隔行换色的表格”注意:(1)jQuery库中的有用的自定义选择符:odd、:even、:not、:eq(2)(2)jQuery对象能够提供隐士迭代和连缀能力。例：1)$('td:contains("简答题")').parent().find('td:gt(0

8、)').addClass('highlight');2)$('td:contains("简答题")').parent().find('td:eq(1)').addClass('highlight').end().find('td:eq(2)').addClass('highlight');其中：end()返回到包含“简答题”的单元格的父节点。目前为止，我们使用了$(document).ready()事件为一组匹配的元素添加类。下一部分将探讨基于用户发起的事件来添加类的