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开始算