jQuery 选择器参考



  • jQuery 选择器

    使用我们的jQuery选择测试仪来演示不同的选择器。
    选择器 语句 描述
    * $("*") 选择所有元素
    #id $("#lastname") id=“lastname”的元素
    .class $(".intro") class=“intro”的所有元素
    .class,.class $(".intro,.demo") 所有带有“intro”或“demo”类的元素
    element $("p") 所有<p>元素
    el1,el2,el3 $("h1,div,p") 所有<h1>,<div>和<p>元素
    :first $("p:first") 第一个<p>元素
    :last $("p:last") 最后一个<p>元素
    :even $("tr:even") 所有偶数<tr>元素
    :odd $("tr:odd") 所有奇数<tr>元素
    :first-child $("p:first-child") 所有<p>元素都是其父元素的第一个子元素
    :first-of-type $("p:first-of-type") 所有<p>元素是其父元素的第一个<p>元素
    :last-child $("p:last-child") 所有<p>元素是其父级的最后一个子元素
    :last-of-type $("p:last-of-type") 所有<p>元素是其父级的最后一个<p>元素
    :nth-child(n) $("p:nth-child(2)") 所有<p>元素是其父级的第二个子元素
    :nth-last-child(n) $("p:nth-last-child(2)") 所有<p>元素,它们是父元素的第二个子元素,从最后一个子元素开始计算
    :nth-of-type(n) $("p:nth-of-type(2)") 所有<p>元素是其父元素的第二个<p>元素
    :nth-last-of-type(n) $("p:nth-last-of-type(2)") 所有<p>元素是其父元素的第二个<p>元素,从最后一个子元素开始计算
    :only-child $("p:only-child") 所有<p>元素是其父元素的唯一子元素
    :only-of-type $("p:only-of-type") 所有<p>元素,它们是父类的唯一子类型
    parent>child $("div > p") 所有<p>元素是<div>元素的直接子元素
    parent descendant $("div p") 所有<p>元素都是<div>元素的后代
    element + next $("div + p") 每个<div>元素旁边的<p>元素
    element ~ siblings $("div ~ p") 所有<p>元素都是<div>元素的兄弟元素
    :eq(index) $("ul li:eq(3)") 列表中的第四个元素(索引从0开始)
    :gt(no) $("ul li:gt(3)") 列出索引大于3的元素
    :lt(no) $("ul li:lt(3)") 列出索引小于3的元素
    :not(selector) $("input:not(:empty)") 所有非空的输入元素
    :header $(":header") 所有标题元素<h1>,<h2> ...
    :animated $(":animated") 所有动画元素
    :focus $(":focus") 当前具有焦点的元素
    :contains(text) $(":contains('Hello')") 包含文本“Hello”的所有元素
    :has(selector) $("div:has(p)") 具有<p>元素的所有<div>元素
    :empty $(":empty") 所有空元素
    :parent $(":parent") 所有元素都是另一个元素的父元素
    :hidden $("p:hidden") 所有隐藏的<p>元素
    :visible $("table:visible") 所有可见的表格
    :root $(":root") 文档的根元素
    :lang(language) $("p:lang(de)") 具有以“de”开头的lang属性值的所有<p>元素
    [attribute] $("[href]") 具有href属性的所有元素
    [attribute=value] $("[href='default.htm']") href属性值等于“default.htm”的所有元素
    [attribute!=value] $("[href!='default.htm']") href属性值不等于“default.htm”的所有元素
    [attribute$=value] $("[href$='.jpg']") href属性值以“.jpg”结尾的所有元素
    [attribute|=value] $("[title|='Tomorrow']") title属性值等于'Tomorrow'的所有元素,或者以'Tomorrow'开头,后跟连字符
    [attribute^=value] $("[title^='Tom']") 标题属性值以“Tom”开头的所有元素
    [attribute~=value] $("[title~='hello']") 具有title属性值的所有元素包含特定单词“hello”
    [attribute*=value] $("[title*='hello']") 标题属性值包含单词“hello”的所有元素
    :input $(":input") 所有输入元素
    :text $(":text") type =“text”的所有输入元素
    :password $(":password") 所有输入元素的类型=“密码”
    :radio $(":radio") type=“radio”的所有输入元素
    :checkbox $(":checkbox") type=“checkbox”的所有输入元素
    :submit $(":submit") type=“submit”的所有输入元素
    :reset $(":reset") type=“reset”的所有输入元素
    :button $(":button") 所有输入元素的type=“button”
    :image $(":image") type=“image”的所有输入元素
    :file $(":file") type=“file”的所有输入元素
    :enabled $(":enabled") 所有启用的输入元素
    :disabled $(":disabled") 所有禁用的输入元素
    :selected $(":selected") 所有选定的输入元素
    :checked $(":checked") 所有选中的输入元素