jquery

1.1 jQuery 支持的 CSS 选择器语法

    * * 任何 element
    * E 类型为 E 的所有element（其实 E 可以是任何 element）
    * E:nth-child(n) 一个类型为 E 的 element，它是其父 element 的第 n 个子 element
    * E:first-child 一个类型为 E 的 element，它是其父 element 的第一个子 element （相当于E:nth-child(0)）
    * E:last-child 一个类型为 E 的 element，它是其父 element 的最后一个子 element
    * E:only-child 一个类型为 E 的 element，它是其父 element 的唯一子 element
    * E:empty 一个类型为 E 的用户界面（UI） element，它没有子 element（包括 文本 element）
    * E:enabled 一个类型为 E 的用户界面（UI） element，它被设置为禁止（disabled）
    * E:disabled 一个类型为 E 的用户界面（UI） element，它被设置为允许（enabled）
    * E:checked 一个类型为 E 的用户界面（UI） element，它处于选中（checked）状态（适用于单选按钮和复选框）
    * E:selected 一个类型为 E 的用户界面（UI） element，它处于被选择（selected）状态（在选择范围内，有一个或多个可供选择的 element ）。注意：selected 属性并不在 CSS 的规范内，但jQuery 提供内部支持
    * E.myclass 一个类型为 E 的 element，它的 class 类是“myclass”
    * E#myid 一个类型为 E 的 element，它的 id 是“myid”
    * E:not(s) 一个类型为 E 的 element，并且结果集中的 element 不匹配（不包含）选择器 s（用作过滤）
    * E F 一个类型为 F 的 element，它是类型为E 的 element 的子孙 element（注意是子孙 element）
    * E > F 一个类型为 F 的 element，它是类型为E 的 element 的子 element（注意是子 element）
    * E + F 一个类型为 F 的 element，它是紧跟在类型为E 的 element 后面的一个兄弟 element（注意 F 是 E 的兄弟节点，并且是紧跟随其后的一个）
    * E ~ F 一个类型为 F 的 element，它是类型为E 的 element 后面的一个兄弟 element（注意 F 是 E 的兄弟节点，并且位置在E 的后面）
    * E,F,G 一个类型为 E 的 element，一个类型为 F 的 element，一个类型为 G 的 element（用于选择多个 element） 

      1.2 jQuery 支持，但（跟 CSS 规范）有所不同的选择器语法

      不同之处是必须在属性名前加上符号“@”
          o E[@foo] 一个类型为 E 的 element，它具有属性“foo”
          o E[@foo=bar] 一个类型为 E 的 element，它具有属性“foo = bar”
          o E[@foo^=bar] 一个类型为 E 的 element，它具有属性“foo“，并且其属性值是以”bar“开头的
          o E[@foo$=bar] 一个类型为 E 的 element，它具有属性“foo“，并且其属性值是以”bar“结尾的
          o E[@foo*=bar] 一个类型为 E 的 element，它具有属性“foo“，并且其属性值包含”bar“
          o E[@foo=bar][@baz=bop] 一个类型为 E 的 element，它具有属性“foo = bar”和属性”baz = bop“

      注：以上的“bar”和“bop”均为字符串。

      1.3 jQuery 不支持的选择器语法（略）

      因为没什么实际的作用，所以这里也不作赘述，想了解详情的可以参阅官方帮助文档。

      1.4 Contex 和 Anchoring

      可以设置 contex 来 anchor（定位） 选择器，这也是 jQuery 跟 CSS 规范的一个不同之处。用户可以使用语法： $(expr, context) 来设置 context root。默认的 context root 是整个文档。

      2. XPath 选择器（XPath Selectors）

      XPath 也是 jQuer 支持的选择器语法之一。jQuery 支持基本的 XPath 语法。下面以一些例子作说明。

      2.1 定位路径（Location Paths）
      
          o 绝对路径，相对于整个 HTML 文档

       $(”/html/body//p”) $(”body//p”) $(”p/../div”)

          o 相对路径，相对于设置的 context node “this”

       $(”p/*”, this) $(”/p//a”, this)

      2.2 支持 Axis 选择器
      
          o “//” ： 子孙 elements （div 所有类型为 p 的子孙 elements）

       $(”/div//p”) $(”//div//p”)

          o “/” ： 子 elements （div 所有类型为 p 的子 elements）

       $(”//div/p”)

          o “~” ： 兄弟 elements （div 所有类型为 form 的兄弟 elements）

       $(”//div ~ form”)

          o ““..”： 父 elements （div 的父 element 下的类型为 p 的子 elements）

       $(”//div/../p”)

      2.3 支持谓词语法（Predicates）
          o [@foo] 具有属性“foo”

       $(”//input[@foo]”)

          o [@foo=’test’] 具有属性“foo = ‘test’”

       $(”//a[@foo = ‘tsxt’]”)

          o [Nodelist] 其子孙 elements 匹配 Nodelist（用于过滤）

       $(”//div[p]”) $(”//div[p/a]”)

      2.4 jQuery 支持，但（跟 XPath 规范）有所不同的谓词语法（Predicates）
      
          o [last()] or [position()=last()] becomes :last（选择结果集中的最后一个 element）

       $(”p:last”)

          o [0] or [position()=0] becomes :eq(0) or :first（选择结果集中的第个 element）

       $(”p:first”) $(”p:eq(0)”)

          o [position() < 5] becomes :lt(5)（选择结果集中索引大于5的 elements）

       $(”p:lt(5)”)

          o [position() > 2] becomes :gt(2)（选择结果集中索引小于2的 elements）

       $(”p:gt(2)”)

      注：“becomes” 前面的是 XPath 的 predicates 语法，后面是等价的 jQuery 语法。

      3. jQuery 自定义的选择器（Custom Selectors）

      jQuery 具有一些自定义的选择器语法，这些语法虽然并不在 CSS 和XPath 规范之内，但它们相当的便捷，所在 jQuery 将它们囊括进来。

      3.1 自定义选择器（Custom Selectors）
      
          o :even 结果集中其索引为偶数（双数）的 elements
          odd 结果集中其索引为奇数（单数）的 elements
          o :eq(N) and :nth(N) 选择结果集中索引为 N 的 elements
          o :gt(N) 选择结果集中索引大于 N 的 elements
          o :lt(N) 选择结果集中索引小于 N 的 elements
          o :first 选择结果集中的第一个 element （相当于 eq(0) 或者 nth(0)）
          o :last 选择结果集中的最后一个 element
          o :parent 在结果集中选择 elements，它必须具有子 elements（包括文本节点）（跟 :empty 相反）
          o :contains(’test’) 选择结果集中包含有指定文本的 elements
          o :visible 选择所有可见（visible）的 elements（ display 属性的值等于 visible、block、inline，或者 visibility 属性的值等于 visible，不包括 hidden 类型的 elements（关于 hidden 类型，如<input type=”hidden” …>））
          o :hidden 选择所有隐藏（visible）的 elements（ display 属性的值等于 none，或者 visibility 属性的值等于 hidden，不包括 hidden 类型的 elements（关于 hidden 类型，如<input type=”hidden” …>））

      例子：

       $(”p:first”).css(”fontWeight”,”bold”); $(”div:hidden”).show(); $(”/div:contains(’test’)”, this).hide();

      3.2 表单选择器（Form Selectors）
          o :input 选择所有表单 elements（input, select, textarea, button）
          o :text 选择所有文本域 (type=”text”).
          o :password 选择所有密码域 (type=”password”).
          o :radio 选择所有单选按钮 (type=”radio”).
          o :checkbox 选择所有复选框 (type=”checkbox”).
          o :submit 选择所有提交按钮 (type=”submit”).
          o :image 选择所有图像域 (type=”image”).
          o :reset 选择所有重置按钮 (type=”reset”).
          o :button 选择所有按钮 (type=”button”).
          o :file 选择所有 <input type=”file”>.

      :hidden 也是可用的，在上面的3.1 节有介绍。

      建议在使用表单选择时提供一个 context root，例子：

       $(’#myForm :input’)

       $(’input:radio’, myForm)

      上面最后的一行语句将会选择所有的“myForm”表单里的所有单选按钮，相当于[@type=radio]（即 $(”[@type = radio],myForm”)），但用表单选择器会稍微快点，尤其对于大型的表单。

      3.3 更多选择器

      jQuery 选择器可以通过第三方的插件来扩展：
          o More Selectors Plugin
          o Mike Alsup on Custom Selectors
          o Patch to allow selection by CSS property (full plugin to be released simultaneously with 1.1)

      参考资料：

      http://docs.jquery.com/DOM/Traversing/Selectors