jQuery 选择器

参考：http://www.cnblogs.com/qiantuwuliang/archive/2009/08/02/1537187.html

jQuery选择器按照功能主要分为"选择"和"过滤". 并且是配合使用的. 可以同时使用组合成一个选择器字符串. 主要的区别是"过滤"作用的选择器是指定条件从前面匹配的内容中筛选, "过滤"选择器也可以单独使用, 表示从全部"*"中筛选. 比如:

$(":[title]")

等同于:

$("*:[title]")

而"选择"功能的选择器则不会有默认的范围, 因为作用是"选择"而不是"过滤".

下面的选择器分类中,  带有"过滤器"的分类表示是"过滤"选择器,  否则就是"选择"功能的选择

jQuery 语法是为 HTML 元素的选取编制的，可以对元素执行某些操作。

基础语法是：$(selector).action()

• 美元符号定义 jQuery
• 选择符（selector）“查询”和“查找” HTML 元素
• jQuery 的 action() 执行对元素的操作

示例

$(this).hide() - 隐藏当前元素

$("p").hide() - 隐藏所有段落

$("p.test").hide() - 隐藏所有 class="test" 的段落

$("#test").hide() - 隐藏所有 id="test" 的元素

在 HTML DOM 术语中：

选择器允许您对 DOM 元素组或单个 DOM 节点进行操作。

jQuery 元素选择器

jQuery 使用 CSS 选择器来选取 HTML 元素。

$("p") 选取 <p> 元素。

$("p.intro") 选取所有 class="intro" 的 <p> 元素。

$("p#demo") 选取 id="demo" 的第一个 <p> 元素。

" "选择元素

.选取class

jQuery 属性选择器

jQuery 使用 XPath 表达式来选择带有给定属性的元素。

$("[href]") 选取所有带有 href 属性的元素。

$("[href='#']") 选取所有带有 href 值等于 "#" 的元素。

$("[href!='#']") 选取所有带有 href 值不等于 "#" 的元素。

$("[href$='.jpg']") 选取所有 href 值以 ".jpg" 结尾的元素。

[]选取属性

jQuery CSS 选择器

jQuery CSS 选择器可用于改变 HTML 元素的 CSS 属性。

下面的例子把所有 p 元素的背景颜色更改为红色：

实例

$("p").css("background-color","red");

jQuery 选择器
      选择器
      实例
      选取
      *
      $("*")
      所有元素
      #id
      $("#lastname")
      id="lastname"
 的元素
      .class
      $(".intro")
      所有 class="intro" 的元素
      element
      $("p")
      所有
 <p> 元素
      .class.class
      $(".intro.demo")
      所有 class="intro" 且 class="demo" 的元素
      :first
      $("p:first")
      第一个
 <p> 元素
      :last
      $("p:last")
      最后一个 <p> 元素
      :even
      $("tr:even")
      所有偶数
 <tr> 元素
      :odd
      $("tr:odd")
      所有奇数 <tr> 元素
      :eq(index)
      $("ul
 li:eq(3)")
      列表中的第四个元素（index 从 0 开始）
      :gt(no)
      $("ul li:gt(3)")
      列出 index 大于 3 的元素
      :lt(no)
      $("ul
 li:lt(3)")
      列出 index 小于 3 的元素
      :not(selector)
      $("input:not(:empty)")
      所有不为空的 input 元素
      :header
      $(":header")
      所有标题元素
 <h1> - <h6>
      :animated
       
      所有动画元素
      :contains(text)
      $(":contains('W3School')")
      包含指定字符串的所有元素
      :empty
      $(":empty")
      无子（元素）节点的所有元素
      :hidden
      $("p:hidden")
      所有隐藏的
 <p> 元素
      :visible
      $("table:visible")
      所有可见的表格
      s1,s2,s3
      $("th,td,.intro")
      所有带有匹配选择的元素
      [attribute]
      $("[href]")
      所有带有
 href 属性的元素
      [attribute=value]
      $("[href='#']")
      所有 href 属性的值等于 "#" 的元素
      [attribute!=value]
      $("[href!='#']")
      所有
 href 属性的值不等于 "#" 的元素
      [attribute$=value]
      $("[href$='.jpg']")
      所有 href 属性的值包含以 ".jpg" 结尾的元素
      :input
      $(":input")
      所有
 <input> 元素
      :text
      $(":text")
      所有 type="text" 的 <input> 元素
      :password
      $(":password")
      所有
 type="password" 的 <input> 元素
      :radio
      $(":radio")
      所有 type="radio" 的 <input> 元素
      :checkbox
      $(":checkbox")
      所有
 type="checkbox" 的 <input> 元素
      :submit
      $(":submit")
      所有 type="submit" 的 <input> 元素
      :reset
      $(":reset")
      所有
 type="reset" 的 <input> 元素
      :button
      $(":button")
      所有 type="button" 的 <input> 元素
      :image
      $(":image")
      所有
 type="image" 的 <input> 元素
      :file
      $(":file")
      所有 type="file" 的 <input> 元素
      :enabled
      $(":enabled")
      所有激活的
 input 元素
      :disabled
      $(":disabled")
      所有禁用的 input 元素
      :selected
      $(":selected")
      所有被选取的
 input 元素
      :checked
      $(":checked")
      所有被选中的 input 元素