jquery中的选择器

一、选择器

1. 过滤选择器   
    1) 基本过滤选择器
        :first  选取第一个元素  单个元素
                eg：$("div:first") 获取页面中第一个 div 元素
        :last  选取最后一个元素  单个元素
                eg：$("div:last") 获取页面中最后一个 div
        :not(selector)  选择非selector的所有元素  元素集合
                eg：$("p:not(.pp)")  选取所有类名不是 pp 的 p 标签
        :odd  选取索引为基数的指定元素，索引从 0 开始   元素集合
                eg：$("p:odd")  获取索引为基数的所有 p 标签
        :even  选取索引为偶数的元素，索引从0开始  元素集合
                eg：$("p:even") 获取索引为偶数的所有 p 标签
        :eq(index)  选取下标为 index 的元素，下标从 0 开始  单个元素
                eg：$("p:eq(3)") 获取下标为3的 p 元素
        :gt(index)  获取索引大于 index 的所有元素，下标从 0 开始  元素集合
                eg：$("p:gt(3)") 获取索引大于 3 的所有 p 标签
        :lt(index   )获取索引小于index 的所有元素，下标从 0 开始  元素集合
                eg：$("p:lt(3)") 获取索引小于 3 的所有 p 标签
    2) 内容过滤选择器   (4)
        根据标签中包含的内容进行过滤
            :contains(text)
                获取包含文本text的元素  元素集合
                eg：$("div:contains('你好')")  选取包含你好的div元素
            :empty
                选取不包含子元素或文本内容的元素  空元素  元素集合
                eg：$("div:empt")  获取内容为空的div
            :has(selector)97
                获取内容包含指定子元素的标签   元素集合
                eg：$("div has(p)")  获取包含 p 标签的div
            :parent()
                获取包含子元素或者文本元素  元素集合  与 empty 相反
                eg：$("div:parent")  获取包含子元素或者文本的div ，当爹的元素被获取
    3) 属性过滤选择器   (7)
        根据属性过滤出我们需要的元素
            E[attr]
                获取拥有 attr 属性的E标签 元素集合
                eg：$("div[id]") 获取拥有 id 属性的 div 标签
            E[att=value]
                获取拥有 attr 属性且值等于 value的元素 元素集合
                eg：$("div[class=box]")  获取class = box 的 div 元素
            E[attr!=value]
                获取拥有 attr 属性且值不等于 value的元素 元素集合
                eg：$("div[class!=box]")  获取class 不等于 box 的 div 元素
            E[attr^=value]
                获取指定属性值为value开头的元素元素集合
                eg：$("div [class^=o"]) 选取class以 o 开头的 div 元素
            E[attr$=value]
                获取指定属性值为 value 结束的元素元素集合
                eg：$("div [class$=s"]) 选取 class 以 s 结束的 div 元素
            E[attr*=value]
                获取指定属性值中包含 value 的元素  元素集合
                eg：$("div[class*=op]")  获取类名中包含 op 的 div 元素
            E[attr1][attr2][attr3]
                选择满足所有属性选择器的元素  元素集合  这是一个交集条件
                eg：$("div [id][class*=pp][title$=l]")
                     选择拥有地属性 ，class包含 pp  title值为 l 结尾的 div元素
    4) 子元素过滤选择器   (4)
        专一用于选择子元素
            :nth-child(index|even|odd)
                获取每一父元素下第 index 个或者奇数偶数个元素，index 从1开始  元素集合
                eg：$("div:nth-child(3)")
                    $("div:nth-child(2n)")  n 从 1 开始
                    获取所有 div 是器父元素 的第3和第2个子元素的div
                    n 个子元素的 div
                    $("div:eq(3)")
            :first-child
                获取每一个父元素中的第一个位子元素集合
                eg：$("li:first-child")
                    获取每一个 ul 或 ol 中第一个li元素
                eg：$("li:first")
                    获取所有li中的第一个
            :last-child
                获取每一个父元素中的最后一个位子元素集合
                eg：$("li:last-child")
                    获取每一个 ul 或 ol 中最后一个li元素
                eg：$("li:last")
                    获取所有 li 中的最后一个
            :only-child
                如果某个元素是他父元素的唯一儿子，将会被选中 元素集合
                eg：$("p:only-child")
                    在 p 标签的父元素中，只有一个 p 标签就被选择
2. 表单选择器
    1) 表单 type 选择器
        :input
            匹配页面中或某一个 form 中所有的 input，textarea，select，button，等元素  元素集合
            eg：$(":input")
        :text
            匹配所有 type = text 的单行文本  元素集合
            eg：$(":text")
        :password
            匹配所有 type = password的密码框   元素集合
            eg：$(":password")
        :radio
            匹配所有 type= radio 的单选框  元素集合
            eg：$(":radio")
        :checkbox
            匹配所有 type= checkbox 的复选框  元素集合
            eg：$(":checkbox")
        :submit
            匹配所有 type= submit 的提交按钮  元素集合
            eg：$(":submit")
        :image
            匹配所有 type= image 的图片提交按钮  元素集合
            eg：$(":image")
        :reset
            匹配所有 type= reset 的重置按钮  元素集合
            eg：$(":reset")
        :button
            匹配所有 type= button 的重置按钮  元素集合
            eg：$(":button")
        :file
            匹配所有 type= file 的文件域  元素集合
            eg：$(":fille")
    2) 表单对象属性过滤选择器
        :enabled
            匹配到所有可用的表单元素  元素集合
            eg：$("form" :enabled)
        :disabled
            匹配到所有不可用的表单元素  元素集合
            eg：$("form" :disabled)
        :checked
            匹配到所有选中的单选框或复选框  元素集合
            eg：$("form :checked")
        :selected
            匹配所有 select 选项元素  元素集合
            eg：("form :selected")

二、jquery 基本事件

1. click 点击事件
    $("div").click(function() {
        // 事件处理程序
    })
    $("div").on("click",function() {
        // 事件处理程序
    })
2. hover
    $("div").hover(
        function(){},function(){});
3. 常用事件
    鼠标事件：
        click  dblclick  mouseenter  mouseleave  mousemove
    键盘事件：
        keydown  keyup  keypress  blur
    表单事件：
        submit  change   focus  input
    窗口事件：
        load  resize  scroll