JQuery选择器&过滤器

JQuery对象:

  • JQuery对象的本质上是DOM数组,它对DOM元素进行了封装
  • JQuery对象和JavaScript对象可以互转(\$()/$obj()[i]),但是JQuery对象和Javascript对象只能调用各自本身的方法,不能相互调用对方的方法

 

 

 

Jquery选择器:

  • elem[prop]:选择有prop属性的elem元素
  • elem[prop=divx]:选择prop属性值为divx的elem元素
  • elem[prop^=a]:起始。选择prop属性值以a起始的elem元素
  • elem[prop$=a]:结束。选择prop属性值以c结束的elem元素
  • elem[prop|=a]:或者。选择prop属性值是a或者a接-的elem元素
  • elem[class~=value]:附带。选择prop属性值附带a的elem元素,如class~="div2",则class为"div2  div3"会被选择
  • elem[prop*="c"]:存在。选择prop属性值里面存在c字符的elem元素
  • elem[prop*="c"][class~=div2]:选择prop属性值存在c字符且class有一个是div2的elem元素
  • elem:not([prop=a]):否定。选择prop属性值不是a的elem元素

 

JQuery过滤器

  • $("li:first"):选择所有li元素里面的第一个li
  • $("li:first-child"):选择所有是第一个子元素的li元素
  • $("li:first-of-type"):当前li是不是父容器当中li类型中的第一个
  • $("li:last"):选择所有li元素里面的第一个li
  • $("li:last-child"):选择所有是第一个子元素的li元素
  • $("li:last-of-type"):当前li是不是父容器当中li类型中的第一个

------------------------------------------------------------------------------------------------------------------

  • $("li:nth-child(2)"):当前li是不是父容器的第二个子元素(从1开始算,2不是索引)
  • $("li:nth-of-type(2)"):寻找当前父元素中li元素中的第二个(从1开始)
  • $(li:nth-child(2n)):偶数。当前li是不是父元素的第偶数个子元素
  • $(li:nth-child(even)):偶数。当前li是不是父元素的第偶数个子元素
  • $(li:nth-child(2n-1)):奇数。当前li是不是父元素的第奇数个子元素
  • $(li:nth-type(odd)):奇数。当前li是不是父元素的第奇数个子元素
  • $(elem:eq(n)):索引等于。文档中都所有该类元素索引等于n的元素
  • $(elem:gt(n)):索引大于。文档中都所有该类元素索引大于n的元素  
  • $(elem:lt(n)):索引小于。文档中都所有该类元素索引小于n的元素 
  •  
  • $(elem.empty):elem元素是否没有子元素或者是没有内容的空元素
  • $(elem.has(.ab)):判断elem元素是否后代元素中有class为ab的元素
  • $(elem:parent):elem有子元素或者有内容被选中
  • $(elem:contains(1)):elem的后代中包含文本1
  • $(elem:parent()):选择父容器
  • $(elem:parent()):选择所有的父容器
  • $(elem:parentUntil("html")):选择所有父容器,截止到html之前的
  •           
  • $(".hidden"):隐藏。只有display:none算,visibility:hidden不算
  • $(":visible"):显示的内容
  • $(div).is(selector):判断div中有没有selector的元素为ab的子元素,返回的是布尔值
  • $(div).hasClass(".ab"):判断div中有没有class是ab的元素,返回布尔值
  • $(div).slice(2,5):获取页面所有div,按索引截取[2,4),不包括4

 

 elem:nth-of-type(num)和elem:nth-child(num)的异同:

  • nth-of-type:父元素里同类元素的第几个,不同类型的不算入顺序,从1开始算
  • nth-child:父元素里子元素的第几个,不同类型的算入顺序,从1开始算
posted @ 2020-02-15 22:58  IslandZzzz  阅读(224)  评论(0编辑  收藏  举报