jQuery—选择器
摘抄自《锋利的jQuery》
一、基本选择器
$("#one").css("background","#bbffaa");
选取id为one的元素, 返回单个元素
$(".mini").css("background","#bbffaa");
选取所有class为test的元素
$("div").css("background","#bbffaa");
选取所有<div>元素
$("*").css("background","#bbffaa");
选取所有的元素
$("span, #two").css("background","#bbffaa");
选取所有<span>元素和id为two的元素, 以逗号相隔
二、层次选择器
$("body div").css("background","#bbffaa");
选取<body>里所有的<div>元素
$("body > div").css("background","#bbffaa");
选取<body>下元素名是<div>的子元素
$(".one + div").css("background","#bbffaa");
选取class为one的下一个<div>同辈元素
$("#two ~ div").css("background","#bbffaa");
选取id为two的元素后面的所有<div>同辈元素
三、过滤选择器
1、基本过滤选择器
$("div:first").css("background","#bbffaa");
选取所有<div>元素中第1个<div>元素, 返回单个元素
$("div:last").css("background","#bbffaa");
选取所有<div>元素中最后一个<div>元素, 返回单个元素
$("div：not(.one)").css("background","#bbffaa");
选取class不是one的<div>元素
$("div:even").css("background","#bbffaa");
选取索引是偶数的<div>元素
$("div:odd").css("background","#bbffaa");
选取索引是奇数的<div>元素
$("div:eq(3)").css("background","#bbffaa");
选取索引等于3的<div>元素
$("div:gt(3)").css("background","#bbffaa");
选取索引大于3的<div>元素
$("div:lt(3)").css("background","#bbffaa");
选取索引小于3的<div>元素
$(":header").css("background","#bbffaa");
选取网页中所有的<h1>,<h2>,<h3>……
$(":animated").css("background","#bbffaa");
选取正在执行动画的<div>元素
$(":focus").css("background","#bbffaa");
选取当前获取焦点的元素
2、内容过滤选择器
$("div:contains(di)").css("background","#bbffaa");
选取含有文本"di"的<div>元素
$("div:empty").css("background","#bbffaa");
选取不包含子元素(包括文本元素)的<div>空元素
$("div:has('.mini')").css("background","#bbffaa");
选取含有class为mini元素的<div>元素
$("div:parent").css("background","#bbffaa");
选取拥有子元素(包括文本元素)的<div>元素
3、可见性过滤选择器
$("div:hidden").css("background","#bbffaa");
选取所有不可见的<div>元素(所有的)
$("div:visible").css("background","#bbffaa");
选取所有可见的<div>元素
4、属性过滤选择器
$("div[title]").css("background","#bbffaa");
选取含有属性title的<div>元素
$("div[title=test]").css("background","#bbffaa");
选取属性title值等于"test"的<div>元素
$("div[title!=test]").css("background","#bbffaa");
选取属性title值不等于"test"的<div>元素
$("div[title^=te]").css("background","#bbffaa");
选取属性title值以"te"开始的<div>元素
$("div[title$=est]").css("background","#bbffaa");
选取属性title值以"est"结束的<div>元素
$("div[title*=es]").css("background","#bbffaa");
选取属性title值含有"es"的<div>元素
5、子元素过滤选择器
$("div .one :nth-child(2)").css("background","#bbffaa");
选取每个class为one的<div>父元素下的第2个子元素
$("div .one :first-child").css("background","#bbffaa");
选取每个class为one的<div>父元素下的第1个子元素
$("div .one :last-child").css("background","#bbffaa");
选取每个class为one的<div>父元素下的最后一个子元素
$("div .one :only-child").css("background","#bbffaa");
如果class为one的<div>父元素下只有一个子元素, 就选取
6、表单对象属性过滤选择器
$("#form1 input:enabled").val("这里变化了！");
选取表单内可用<input>元素
$("#form2 input:disabled").val("这里变化了！");
选取表单内不可用的<input>元素
$("input:checked").length
多选框选中的个数
$("select :selected").text();
下拉框选中的内容
四、表单选择器
$(":input")
选取所有<input>、<textarea>、<select>和<button>
$(":text")
选取所有的单行文本框
$(":password")
选取所有的密码框
$(":radio")
选取所有的单选框
$(":checkbox")
选取所有的多选框
$("submit")
选取所有的提交按钮
$("image")
选取所有的图像按钮
$("reset")
选取所有的重置按钮
$("button")
选取所有的按钮
$("file")
选取所有的上传域
$(":hidden")
选取所有不可见元素
