JQuery 选择器

基本选择器

id选择器

id 选择器，根据 id查询标签对象

var obj = $("#id");

标签名选择器

标签名选择器，根据指定的标签名查询标签对象

var obj = $("p");

类选择器

类选择器，根据指定的类名名查询标签对象

var obj = $(".gender");

属性名选择器

属性名选择器，根据指定的属性名查询标签对象

var obj = $("[name=email]");

层级选择器

• 在给定的祖先元素下匹配所有的后代元素

  form 中 所有input标签

  $("form input")
  

• 在给定的父元素下匹配所有的子元素

  form 中 所有子级input元素

  $("form > input")
  

• 匹配所有紧接在 prev 元素后的 next 元素

  匹配所有跟在 label 后面的 input 元素

  $("label + input")
  

• 匹配 prev 元素之后的所有 siblings 元素

  找到所有与表单同辈的 input 元素

  $("form ~ input")
  

过滤选择器

基本过滤器

• :frist

  获取匹配的第一个元素

  $('li:first');

• :last

  获取匹配的最后个元素

  $('li:last');

• :not

  查找所有未选中的 input 元素

  $("input:not(:checked)")

• :even

  查找表格的1、3、5…行（即索引值0、2、4…）

  $("tr:even")

• :odd

  查找表格的2、4、6行（即索引值1、3、5…）

  $("tr:odd")

• :eq

  查找第二行

  $("tr:eq(1)")

• :gt

  查找第二第三行，即索引值是1和2，也就是比0大

  $("tr:gt(0)")

• :lt

  查找第一第二行，即索引值是0和1，也就是比2小

  $("tr:lt(2)")

• :header

  匹配如 h1, h2, h3之类的标题元素

  给页面内所有标题加上背景色

  $(":header").css("background", "#EEE");

• :animated

  匹配所有正在执行动画效果的元素

  只有对不在执行动画效果的元素执行一个动画特效

  $("#run").click(function(){
    $("div:not(:animated)").animate({ left: "+=20" }, 1000);
  });
  

• :focus

  触发每一个匹配元素的focus事件。这将触发所有绑定的focus函数，注意，某些对象不支持focus方法。

  当页面加载后将 id 为 ‘login’ 的元素设置焦点:

  $("#login:focus");

内容过滤器

• :contains(text)

  匹配包含给定文本的元素

  查找所有包含“John”的div元素

  $("div:contains('John')")
  

• :empty

  匹配所有不包含子元素或者文本的空元素

  查找所有不包含子元素或者文本的空元素

  $("td:empty")
  

• :has(selector)

  匹配含有选择器所匹配的元素的元素

  给所有包含p元素的div元素添加一个text类

  $("div:has(p)".addClass("test"));
  

• :parent

  匹配含有子元素或者文本的元素

  查找所有含有子元素或者文本的 td 元素

  $("td:parent");
  

表单过滤器

• ：input

  匹配所有 input, textarea, select 和 button 元素

  查找所有的input元素，下面这些元素都会被匹配到。

  $(":input")
  

• :text

  匹配所有的单行文本框

  查找所有文本框

  $(":text");
  

• :password

  匹配所有密码框

  查找所有密码框

  $(":password");
  

• :radio

  匹配所有单选按钮

  查找所有单选按钮

  $(":radio");
  

• :checkbox

  匹配所有复选框

  查找所有复选框

  $(":checkbox");
  

• :submit

  匹配所有提交按钮

  查找所有提交按钮

  $(":submit");
  

• ：image

  匹配所有图像域

  $(":image");
  

• :reset

  匹配所有重置按钮

  $(":reset");
  

• :button

  匹配所有按钮

  $(":button");
  

• :file

  匹配所有文件域

  $(":file");
  

• :hidden

  匹配所有不可见元素，或者type为hidden的元素

  $("input:hidden")
  

表单对象属性

• :enabled

  匹配所有可用元素

  $("input:enabled")
  

• :disabled

  匹配所有不可用元素

  $("input:disabled")
  

• :checked

  匹配所有选中的被选中元素(复选框、单选框等，不包括select中的option)

  $("input:checked")
  

• :selected

  匹配所有选中的option元素

  $("select option:selected")