$("p")[0]：jquery对象转为dom对象      
$("p").html() 等价于 $("p")[0].innerHTML

$("*")，$("#id")，$(".class")，$("标签名")，$(".class,p,div")

1：$("ancestor descendant")：匹配 ancestor 下所有的后代 descendant 元素（descendant ：用以匹配元素的选择器，并且它是第一个选择器的后代元素）
2：$("parent > child")：匹配 parent 下所有的子代 child 元素（child ：用以匹配元素的选择器，并且它是第一个选择器的子元素）
3：$("prev + next")：匹配紧挨着 prev 的 next 元素（next ：一个有效选择器并且紧接着第一个选择器）
4：$("prev ~ siblings")：匹配 prev 元素之后的所有 siblings 元素(siblings ：一个选择器，并且它作为第一个选择器的同辈)

1：$("[属性名='name']")：匹配满足属性名=name的元素
例：$("[class='div1']").css("color", "red");

2：$("[属性名='name1'][自定义属性名='name2']"):配满足属性名=name1的元素,自定义属性名=name2的元素
例：$("[class='div1'][kelvin='111']").css("color", "red");

1：$("li:first") ： 匹配 li 元素的第一个
2：$("li:first") ： 匹配 li 元素的最后一个
3：$("li:eq(2)") ： 匹配 li 元素下标为2的 li 元素
4：$("li:even") ： 匹配 li 元素下标为偶数的 li 元素
5：$("li:odd") ： 匹配 li 元素下标为奇数的 li 元素
6：$("li:gt(1)") ： 匹配 li 元素下标大于1的 li 元素

$("[type='name']")----->$(":name")         **只适用于input标签  : $("input:checked")

1：$("li").eq(2)  等价于 $("li:eq(2)")
2：$("li").first()  等价于 $("li:first")
3：$("ul li").hasclass("name") :找到 ul 下的 li 元素class值为 name 的 li 元素

1.1：$("parent").children("child")：匹配 parent 的子代 child     
1.2：$("parent").find("child")  ：匹配 parent 的后代 child  

2.1：$("parent").next()  ：匹配紧挨着 parent 的下一个同级元素
2.2：$("parent").nextAll()   ：匹配 parent 下的所有同级元素
2.3：$("parent").nextUntil(指定位置)  ：匹配从 parent 到 指定位置 的区间（不包括头尾）元素
                           
3.1：$("parent").prev()    ：匹配紧挨着 parent 的上一个同级元素
3.2：$("parent").prevAll()    ：匹配 parent 上的所有同级元素
3.3：$("parent").prevUntil(指定位置) ：匹配从 parent 到 指定位置 的区间（不包括头尾）元素
                        
4.1：$("child").parent()  ：匹配 child 的第一级父元素
4.2：$("child").parents()    ：匹配 child 的所有父级元素对象并组成一个数组
4.3：$("child").parentUntil(指定位置)   ：匹配 child 从第一级父级元素到指定位置父级元素并组成一个数组（不包括最后一个父级元素）

5：$("div").siblings() ：匹配 div 的所有兄弟元素（div上下都包括）

------------属性--------------
$("").attr(); 对于HTML元素我们自己自定义的DOM属性，在处理时，使用attr方法。
$("").removeAttr();
$("").prop();  对于HTML元素本身就带有的固有属性，在处理时，使用prop方法。像checkbox，radio和select这样的元素，选中属性对应“checked”和“selected”，这些也属于固有属性
$("").removeProp();
-----------CSS类-------------
$("").addClass(class|fn)
$("").removeClass([class|fn])
-----------HTML代码/文本/值-------------
$("").html([val|fn])
$("").text([val|fn])
$("").val([val|fn|arr])
---------------------------
$("").css(属性名,属性值)

//创建一个标签对象
    $("<p>")

//内部插入
    $("").append(content|fn)      ----->$("p").append("<b>Hello</b>");
    $("").appendTo(content)       ----->$("p").appendTo("div");
    $("").prepend(content|fn)     ----->$("p").prepend("<b>Hello</b>");
    $("").prependTo(content)      ----->$("p").prependTo("#foo");

//外部插入
    $("").after(content|fn)       ----->$("p").after("<b>Hello</b>");
    $("").before(content|fn)      ----->$("p").before("<b>Hello</b>");
    $("").insertAfter(content)    ----->$("p").insertAfter("#foo");
    $("").insertBefore(content)   ----->$("p").insertBefore("#foo");

//替换
    $("").replaceWith(content|fn) ----->$("p").replaceWith("<b>Paragraph. </b>");

//删除
    $("").empty()
    $("").remove([expr])

//复制
    $("").clone([Even[,deepEven]])

CSS
       $("").css(name|pro|[,val|fn])
位置
        $("").offset([coordinates])
        $("").position()
        $("").scrollTop([val])
        $("").scrollLeft([val])
尺寸
        $("").height([val|fn])  ：元素本身的高度
        $("").width([val|fn])  ：元素本身的宽度
        $("").innerHeight()  ：元素本身高度+内边距的高度
        $("").innerWidth()  ：元素本身宽度+内边距的宽度
        $("").outerHeight([soptions])  ：元素本身高度+内边距的高度+border宽度+（margin）
        $("").outerWidth([options])  ：元素本身宽度+内边距的宽度+border宽度+（margin）

页面载入
    ready(fn)  **当DOM载入就绪可以查询及操纵时绑定一个要执行的函数。
    方式1：$(document).ready(function(){}) 
    方式2：$(function(){})

事件处理
    $("").on(eve,[selector],[data],fn)  // 在选择元素上绑定一个或多个事件的事件处理函数。
    **  .on的selector参数是筛选出调用.on方法的dom元素的指定子元素，如：
    **  $('ul').on('click', 'li', function(){console.log('click');})就是筛选出ul下的li给其绑定
    **  click事件；

    [selector]参数的好处:
        好处在于.on方法为动态添加的元素也能绑上指定事件；如：
        **$('ul li').on('click', function(){console.log('click');})的绑定方式和
        **$('ul li').bind('click', function(){console.log('click');})一样；我通过js给ul添加了一个
        **li：$('ul').append('<li>js new li<li>')；这个新加的li是不会被绑上click事件的
        **但是用$('ul').on('click', 'li', function(){console.log('click');}方式绑定，然后动态添加
        **li:$('ul').append('<li>js new li<li>');这个新生成的li被绑上了click事件
    
    [data]参数的调用:
             function myHandler(event) {
                  alert(event.data.foo);
              }
             $("li").on("click", {foo: "bar"}, myHandler)