jQuery中的选择器

    xiaoxiao2025-06-23  10

    jQuery中的选择器分成3类,分别是基本选择器、层次选择器和过滤选择器。

    一:基本选择器: 1.选择id为one的元素:$("#one") 2.选择class为nimi的所有的元素:$(".nimi") 3.选择标签名是div的所有元素:$("div") 4.选择所有的元素:$("*") 5.组合选择器,比如选择所有的span元素和id为two的元素: $("span,#two") 二:层次选择器: 1.选择body内所有的div元素:$("body div") 2.选择body内所有的子元素是div的元素:$("body>div") 3.选择id为one的下一个div元素:$("#one+div") 4.选择id为two元素的后面所有div兄弟元素:$("#two~div") 5.选择id为two元素的所有div兄弟元素:$("#two").siblings("div") 三:过滤选择器: (一):基本的过滤选择器: 1.选择第一个/最后一个div元素:$("div:first")/$("div:last") 2.选择class不为one的所有div元素:$("div:not('one')") 3.选择索引值为偶数的所有div元素:$("div:even") 4.选择索引值为奇数的所有div元素:$("div:odd") 5.选择索引值为3的元素:$("div:eq(3)") 6.选择索引值大于3的元素:$("div:gt(3)") 7.选择索引值小于3的元素:$("div:lt(3)") 8.选择所有的标题元素:$(":header") 9.选择当前正在执行动画的所有元素:$("animated") (二):内容的过滤选择器: 1.选取含有文本“di”的div元素:$("div:contains('di')") 2.选取不包含子元素(或者文本元素)的div空元素:$("div:empty") 3.选取含有class为mini元素 的div元素:$("div:has('.mini')") 4.选取含有子元素(或者文本元素)的div元素:$("div:parent") (三):可见性的过滤选择器: 1.选取所有可见的div元素:$("div:visible") 2.选取所有不可见的元素, 利用 jQuery 中的 show() 方法将它们显示出来":$("div:hidden").show(2000); 3.选取所有的文本隐藏域, 并打印它们的值:$("input:hidden").each(function(index,dom){ } (四):属性选择器: 1.选取含有属性title 的div元素:$("div[title]") 2.选取属性title值等于“test”的div元素:$("div[title=test]") 3.选取 属性title值不等于“test”的div元素(没有属性title的也将被选中):$("div[title!=test]") 4.选取属性title值以“te”开始的div元素:$("div[title^=te]") 5.选取属性title值以“est”结束的div元素: $("div[title$=est]") 6.选取属性title值含有“es”的div元素:$("div[title*=es]") 7.组合属性选择器,首先选取有属性id的div元素,然后在结果中 选取属性title值含有“es”的元素: $("div[id][title*=es]") (五):子元素过滤选择器: 1.选取每个class为one的div,父元素下的第2个子元素:$("div[class=one] :nth-child(2)") 2.选取每个class为one的div, 父元素下的第一个子元素:$("div[class=one] :first-child") 3.选取每个class为one的div父元素下的最后一个子元素: $("div[class=one] :last-child") 4.如果class为one的div父元素下的仅仅只有一个子元素,那么选中这个子元素:$("div[class=one] :only-child") (六):表单对象属性过滤选择器: 1.对表单内可用input赋值操作:$("input:enabled") 2.对表单内不可用input赋值操作:$("input:disabled") 3.获取多选框选中的个数:$("input:checked").size()

    ……..

    转载请注明原文地址: https://ju.6miu.com/read-1300245.html
    最新回复(0)