JQuery
一．概要及基础
1.轻量级
2.强大的选择器
3.出色的dom操作的封装
4.可靠的事件处理机制
5.完善的ajax
6.不污染顶级变量
释放JQuery 对$符号的控制权
JQuery.noConflict();
7.出色的浏览器兼容性
8.链式操作方式
9.隐式迭代
10.行为层与结构层的分离
11.丰富的插件支持
12.完善的文档
13.开源
页面加载事件（可以写多个ready()）
$(document).ready(function(){
alert("hello world");
})
$(function(){
//Todo();
});
链式操作：JQuery 允许你在一句代码中操做任何与其相关联的元素，包括其子元素、父元
素等
//选择名称为myDiv 的元素，为其自身添加css1 的样式，然后再选择其所有子元素a，为其
移除css2 样式
$("#myDiv").addClass("css1").children("a").removeClass("css2");
Query 中获得一个对象的所有子元素内容
$("#myDiv").html()
JQuery 中的变量与DOM 中的变量
var $myVar = "";
var myVar = "";
DOM 对象转换成JQuery 对象
var obj = documnet.getElementById("myDiv");
var $obj = $(obj);
JQuery 对象转换成DOM 对象
var $obj = $("#myDiv");
var obj = $obj.get(0); //或者var obj = $obj[0];
二．选择器
JQuery 完善的处理机制
document.getElementById("test").style.color ="red"; //如果test 不存在，则页面出
现异常
$("#test").css("color","red"); //哪怕页面没有名称为test 的元素，也不会报错。它是
一个JQuery 对象
判断页面是否选择的对象
if( $(".class").length >0 ){
// todo something
}
基本选择器
$("#myDiv") //根据给定的ID 选择匹配的元素，返回：单个元素
$(".myClass") //根据给定的样式名称选择匹配的元素，返回：集合元素
$("div") //根据给定的元素名称选择匹配的元素，返回：集合元素
$("#myDiv,div.myClass,span") //根据给定的规则选择匹配的元素，返回：集合元素
$("*") //选择页面所有元素，返回：集合元素
层次选择器
$("div span") //选择所有DIV 元素下的所有SPAN 元素（所有后代元素），返回：集合元
素
$("div>span") //选择所有DIV 元素下的SPAN 子元素（仅子元素），返回：集合元素
$(".myClass+div") //选择样式名称为myClass 的下一个DIV 元素，返回：集合元素
$(".myClass+div") //等价于$(".myClass").next("div");
$(".myClass~div") //选择样式名称为myClass 之后的所有DIV 元素，返回：集合元素
$(".myClass~div") //等价于$(".myClass").nextAll();
$(".myClass").siblings("div") //选择样式名称为myClass 的元素的所有同辈DIV 元素
（无论前后），返回集合元素
过滤选择器（index从0开始）
$("div:first") //选择所有DIV 元素下的第一个DIV 元素，返回：单个元素
$("div:last") //选择所有DIV 元素下的最后一个DIV 元素，返回：单个元素
$("div:not(.myClass)") //选择所有样式不包括myClass 的DIV 元素，返回：集合元素
$("div:even") //选择所有索引是偶数的DIV 元素，返回：集合元素
$("div:odd") //选择所有索引是奇数的DIV 元素，返回：集合元素
$("div:eq(index)") //选择所有索引等于index 的DIV 元素，返回：集合元素
$("div:gt(index)") //选择所有索引大于index 的DIV 元素，返回：集合元素
$("div:lt(index)") //选择所有索引小于index 的DIV 元素，返回：集合元素
$(":header") //选择所有标题元素（h1,h2,h3），返回：集合元素
$("div:animated") //选择所有正在执行去画的DIV 元素，返回：集合元素
子元素过滤选择器（index从1开始）
$(":nth-child(index/even/odd)") //选择每个父元素下的第index/偶数/奇数个子元素，
返回：集合元素
$(":first-child") //选择每个父元素下的第一个子元素，返回：集合元素
$(":last-child") //选择每个父元素下的最后一个子元素，返回：集合元素
$("ul li:only-child") //在UL 元素中选择只有一个LI 元素的子元素，返回：集合元素
内容过滤选择器
$(":contains(text)") //选择所有内容包含text 的元素，返回：集合元素
$("div:empty") //选择所有内容为空的DIV 元素，返回：集合元素
$("div:has(span)") //选择所有含有SPAN 子元素的DIV 元素，返回：集合元素
$("div:parent") //选择所有含有子元素的DIV 元素，返回：集合元素
可见性选择器
$(":hidden") //选择所有不可见的元素（type="hidden" style="display:none"
style="visibility:none"），返回：集合元素
$(":visible") //选择所有可见的元素，返回：集合元素
属性过滤选择器
$("[id]") //选择所有含有id 属性的元素，返回：集合元素
$("[class=myClass]") //选择所有class 属性值是myClass 的元素，返回：集合元素
$("[class!=myClass]") //选择所有class 属性值不是myClass 的元素，返回：集合元素
$("[alt^=begin]") //选择所有alt 属性值以begin 开始的元素，返回：集合元素
$("[alt^=end]") //选择所有alt 属性值以end 结束的元素，返回：集合元素
$("[alt*=some]") //选择所有alt 属性值含有some 的元素，返回：集合元素
$("div[id][class=myClass]") //选择所有含有id 属性的并且class 属性值是myClass 的
元素，返回：集合元素
表单对象属性选择器
$("#myForm:enabled") //选择ID 属性为myForm 的表单的所有可用元素，返回：集合元素
$("#myForm:disabled") //选择ID 属性为myForm 的表单的所有不可用元素，返回：集合元
素
$("#myForm:checked") //选择ID 属性为myForm 的表单的所有所有被选中的元素，返回：
集合元素
$("#myForm:selected") //选择ID 属性为myForm 的表单的所有所有被选中的元素，返回：
集合元素
表单选择器
$(":input") //选择所有