jQuery过滤器基础

过滤器：

• $("li:first")===$("li").first();
  $("li:last");===$("li").last();//选择列表的第一项和最后一项
  
  $(".div0:first");
  $(".div0:last");//这是可以使用的
  
  $("div:first-child");//这是不可以使用的，因为没有父元素
  $(".div0:first-of-type");//这是不支持的
  $(".div0:first-child");//这样也不支持

• :not()不包含某些选择器的
  $("li[class!=div0]");
  $("li:not([class=div0])");//和上面相同
  $("li:not([class~=div0])")===$("li").not("[class~=div0]");

• 按奇偶选择
  $("li:even").css("backgroundColor","red");//列表中偶数序列  从零开始算偶数
  $("li:odd").css("backgroundColor","red");//列表中奇数序列   从一开始算奇数

• 按索引选择
  $("li:eq(1)");===$("li").eq(0);//列表中索引值所对应的元素
  $("li:gt(2)");//从列表中索引值是2的向下所有的元素
  $("li:lt(2)");//从列表中索引值是2的向上所有的元素

• 比较冷门的
  $(":header");//h1-h6
  $(":animated");//动画选择器
  $(":focus");//汇集焦距选择器

• 内容过滤器
  $("div:empty") ;//过滤div是空元素;不含有子元素和内容元素
  
  
  //     div它的子项中有class是.div0
  $("div:has(.div0)");===$("div").has(".div0");//找的是父级元素，如果某个元素有div0这个class，就会找到它的所有父级元素
  
  
  //        与$("div:empty")相反
  $("div:parent");//过滤div中是不是空元素的，含有子元素和内容的元素

• $("span").parent();//仅找到当前选择器的父元素
  $("span").parents();//找到所有的父元素
  $("span").parentsUntil("body");//找到父级元素到某个父级元素为止

• $("div:contains('2')"))
  $("div").contains("2");//包含有2这个内容的div
  
  
  主要是针对display:none来使用
  $("div:hidden");//隐藏
  $("div:visible");//显示的元素
  

• $("li:only-child");//当前项仅为父元素的唯一子项
  $("li:nth-child(2)");  //有父元素的li列表中的第2个元素
  
  $("li:nth-child(even)");  //从1开始的偶数项
  $("li:nth-child(odd)");   //从0开始的奇数项
  
  
  $("li:nth-child(2n)");
  $("li:nth-child(2n-1)");//奇偶数

• 判断列表中有没有class是.li0的元素，返回结果是true
  $("li").is(".li0");
  
  //   判断列表中有没有id是lis的元素
  $("li").is("#lis");
  
  //         判断当前列表中有没有class是.li0，只能判断class，函数中不使用.来说明class名
  $("li").hasClass("li0")

• 从jQuery列表中截取对应的元素
  
  $("li").slice(2,5);