> （大于号）紧跟父子关系 如$("div > p")表示选择div下的直接层是p的节点。
+ （加号）  紧跟兄弟关系 如$("div + p")表示选择div同层的左右相邻的p节点。
~ （波浪线）任意距离兄弟关系 如$("div + p")表示选择div同层的p节点。
(空格)    任意层父子关系 如$("div p")表示选择div下的p节点（不管中间隔多少层）。
,(逗号)   表示选择器组合，如$("div p, span p")表示div下p节点和span下p节点。

$( "parent > child" ) 子选择器：选择所有指定“parent”元素中指定的"child"的直接子元素。 $("ancestor descendant") 后代选择器：选择给定的祖先元素的所有后代元素, 一个元素的后代可能是该元素的一个孩子，孙子，曾孙等 $("prev + next") 相邻兄弟选择器：选择所有紧接在“prev”元素后的“next”元素 $("prev ~ siblings") 一般兄弟选择器：匹配“prev”元素之后的所有 兄弟元素。具有相同的父元素，并匹配过滤“siblings”选择器 $( "parent > child" ) 子选择器：选择所有指定“parent”元素中指定的"child"的直接子元素。 $("ancestor descendant") 后代选择器：选择给定的祖先元素的所有后代元素, 一个元素的后代可能是该元素的一个孩子，孙子，曾孙等 $("prev + next") 相邻兄弟选择器：选择所有紧接在“prev”元素后的“next”元素 $("prev ~ siblings") 一般兄弟选择器：匹配“prev”元素之后的所有 兄弟元素。具有相同的父元素，并匹配过滤“siblings”选择器 

> （大于号）紧跟父子关系 如$("div > p")表示选择div下的直接层是p的节点。
+ （加号）  紧跟兄弟关系 如$("div + p")表示选择div同层的左右相邻的p节点。
~ （波浪线）任意距离兄弟关系 如$("div + p")表示选择div同层的p节点。
(空格)    任意层父子关系 如$("div p")表示选择div下的p节点（不管中间隔多少层）。
,(逗号)   表示选择器组合，如$("div p, span p")表示div下p节点和span下p节点。

1.版本兼容性问题：1.x的基本可以兼容，2.x会比较快，效率也比较高，单不兼容ie8及前版本

选择器

$(*)全部选择

兼容性问题

不难发现，id、class、tag都可以通过原生的方法获取到对应的节点，但是我们还需要考虑一个兼容性的问题，我这里顺便提及一下，比如:

1. IE会将注释节点实现为元素，所以在IE中调用getElementsByTagName里面会包含注释节点，这个通常是不应该的

2. getElementById的参数在IE8及较低的版本不区分大小写

3. IE7及较低的版本中，表单元素中，如果表单A的name属性名用了另一个元素B的ID名并且A在B之前，那么getElementById会选中A

4. IE8及较低的版本，浏览器不支持getElementsByClassName

$(document).ready 的作用是等页面的文档（document）中的节点都加载完毕后，再执行后续的代码，因为我们在执行代码的时候，可能会依赖页面的某一个元素，我们要确保这个元素真正的的被加载完毕后才能正确的使用。

<script type="text/javascript">

       //通过原生方法处理

        var div = document.getElementById('aaron');

        div.style.border = "3px solid blue";

    </script>

    <script type="text/javascript">

    //通过jQuery直接传入id

    //id的唯一，只选择到了第一个匹配的id为imooc的div节点

     $("#imooc").css("border", "4px solid red");

    </script>

jQuery.data( element, key, value )   //静态接口,存数据
jQuery.data( element, key )  //静态接口,取数据  
.data( key, value ) //实例接口,存数据.data( key ) //实例接口,存数据

2个方法在使用上存取都是通一个接口，传递元素，键值数据。在jQuery的官方文档中，建议用.data()方法来代替。

我们把DOM可以看作一个对象，那么我们往对象上是可以存在基本类型，引用类型的数据的，但是这里会引发一个问题，可能会存在循环引用的内存泄漏风险

通过jQuery提供的数据接口，就很好的处理了这个问题了，我们不需要关心它底层是如何实现，只需要按照对应的data方法使用就行了

同样的也提供2个对应的删除接口，使用上与data方法其实是一致的，只不过是一个是增加一个是删除罢了

jQuery.removeData( element [, name ] )
.removeData( [name ] )

.toggleClass( )方法：在匹配的元素集合中的每个元素上添加或删除一个或多个样式类,取决于这个样式类是否存在或值切换属性。即：如果存在（不存在）就删除（添加）一个类

.toggleClass( className )：在匹配的元素集合中的每个元素上用来切换的一个或多个（用空格隔开）样式类名

.toggleClass( className, switch )：一个布尔值，用于判断样式是否应该被添加或移除

.toggleClass( [switch ] )：一个用来判断样式类添加还是移除的 布尔值

.toggleClass( function(index, class, switch) [, switch ] )：用来返回在匹配的元素集合中的每个元素上用来切换的样式类名的一个函数。接收元素的索引位置和元素旧的样式类作为参数

.val()方法

.val()无参数，获取匹配的元素集合中第一个元素的当前值

.val( value )，设置匹配的元素集合中每个元素的值

.val( function ) ，一个用来返回设置值的函数

 注意事项：

通过.val()处理select元素， 当没有选择项被选中，它返回null

.val()方法多用来设置表单的字段的值

如果select元素有multiple（多选）属性，并且至少一个选择项被选中， .val()方法返回一个数组，这个数组包含每个选中选择项的值

attr()有4个表达式

attr(传入属性名)：获取属性的值

attr(属性名, 属性值)：设置属性的值

attr(属性名,函数值)：设置属性的函数值

attr(attributes)：给指定元素设置多个属性值，即：{属性名一: “属性值一” , 属性名二: “属性值二” , … … }

removeAttr()删除方法

.removeAttr( attributeName ) : 为匹配的元素集合中的每个元素中移除一个属性（attribute）

除了表单元素选择器外，表单对象属性筛选选择器也是专门针对表单元素的选择器，可以附加在其他选择器的后面，主要功能是对所选择的表单元素进行筛选。 :enabled    选取可用的表单元素 :disabled   选取不可用的表单元素 :checked    选取被选中的<input>元素 :selected   选取被选中的<option>元素 注意：1  选择器适用于复选框和单选框，队员下拉框元素，使用:selected选择器      2  在某些浏览器中，选择器:checked可能会错误，选取到<option>元素，所以保险起见换用选择器input:checked，确保只会选取<input>元素。

$(":input") $("input:text")匹配所有文本框 $("input:password")匹配所有密码档 $("input:radio")匹配所有单选按钮 $("input:checkbox")匹配所有复选框 $("input:submit")匹配所有提交按钮 $("input:image")匹配所有图像域 $("input:reset")匹配所有重置按钮 $("input:button")匹配所有按钮 $("input:file")匹配所有文件域