1. jQuery概述
- jQuery是一个优秀的JavaScript框架
- 主要提供如下功能
- 访问页面框架的局部
- 修改页面的表现
- 更改页面的内容
- 响应事件
- 为页面添加动画
- 与服务器异步交互
- 简化常用的JavaScript操作
- 下载并使用jQuery
- 官方网站（http://jquery.com/）
- 不需要任何安装过程
2. jQuery的“$”
- 选择器
- 功能函数前缀
- window.onload
- window.onload的冲突
- ready()方法
- 创建DOM元素
3. 选择器
- 属性选择器
- 位置选择器
3. 实例
实例一 ：一行代码实现隔行变色效果：
![]()
Code
运行效果：
![]()
实例二 ：选择器
![]()
Code
运行效果：
![]()
实例三：字符串操作：
![]()
Code
实例4：获取浏览器的型号和版本号“
![]()
Code
四：核心部分
$(expr)：该函数可以通过css选择器，Xpath或html代码来匹配目标元素，所有的jQuery操作都以此为基础。expr：字符串，一个查询表达式或一段html字符串
例子：
<
p
>
one
</
p
>
<
div
>
<
p
>
two
</
p
>
</
div
>
<
p
>
three
</
p
>
<
a
href
="#"
id
="test"
onClick
="jq()"
>
jQuery
</
a
>
function jq(){
alert($("div > p").html());
}
运行：当点击id为test的元素时，弹出对话框文字为two，即div标签下p元素的内容
function jq(){
$("
<
div
><
p
>
Hello
</
p
></
div
>
").appendTo("body");
}
当点击id为test的元素时，向body中添加“<div><p>Hello</p></div>”
$(elem)
说明：限制jQuery作用于一个特定的dom元素，这个函数也接受xml文档和windows对象
参数： elem：通过jQuery对象压缩的DOM元素
例子：
未执行jQuery前：
<
p
>
one
</
p
>
<
div
>
<
p
>
two
</
p
>
</
div
><
p
>
three
</
p
>
<
a
href
="#"
id
="test"
onClick
="jq()"
>
jQuery
</
a
>
function jq(){
alert($(document).find("div > p").html());
}
运行：当点击id为test的元素时，弹出对话框文字为two，即div标签下p元素的内容
function
jq(){
$(document.body).background(
"
black
"
);
}
运行：当点击id为test的元素时，背景色变成黑色
$(elems)
说明：限制jQuery作用于一组特定的DOM元素
参数： elem：一组通过jQuery对象压缩的DOM元素
例子：
未执行jQuery前：
<
form
id
="form1"
>
<
input
type
="text"
name
="textfield"
>
<
input
type
="submit"
name
="Submit"
value
="提交"
>
</
form
>
<
a
href
="#"
id
="test"
onClick
="jq()"
>
jQuery
</
a
>
function
jq(){
$(form1.elements ).hide();
}
运行：当点击id为test的元素时，隐藏form1表单中的所有元素。
jQuery代码及功能：
四：总结
通过Jquery使我们操作更加方便.
本文转自麒麟博客园博客，原文链接：http://www.cnblogs.com/zhuqil/archive/2008/08/22/1273929.html，如需转载请自行联系原作者
