您好,欢迎访问一九零五行业门户网

juqery 学习之三 选择器 简单 内容_jquery

:first匹配找到的第一个元素
matches the first selected element.
返回值element
示例查找表格的第一行
html 代码:
header 1
value 1
value 2
jquery 代码:
$(tr:first)
结果:
[ header 1
]
---------------------------------------------------------------------------------------
:last匹配找到的最后一个元素
matches the last selected element.
返回值element
示例查找表格的最后一行
html 代码:
header 1
value 1
value 2
jquery 代码:
$(tr:last)
结果:
[ value 2
]
---------------------------------------------------------------------------------------
:not(selector)去除所有与给定选择器匹配的元素
removes all elements matching the given selector.
返回值array
参数selector (selector) : 用于筛选的选择器
示例查找所有未选中的 input 元素
html 代码:
jquery 代码:
$(input:not(:checked))
结果:
[  ]
---------------------------------------------------------------------------------------
:even匹配所有索引值为偶数的元素,从 0 开始计数
matches even elements, zero-indexed.
返回值array
示例查找表格的1、3、5...行(即索引值0、2、4...)
html 代码:
header 1
value 1
value 2
jquery 代码:
$(tr:even)
结果:
[ header 1
, value 2
]
---------------------------------------------------------------------------------------
:odd匹配所有索引值为奇数的元素,从 0 开始计数
matches odd elements, zero-indexed.
返回值array
示例查找表格的2、4、6行(即索引值1、3、5...)
html 代码:
header 1
value 1
value 2
jquery 代码:
$(tr:odd)
结果:
[ value 1
]
---------------------------------------------------------------------------------------
:eq(index)匹配一个给定索引值的元素
matches a single element by its index.
返回值element
参数index (number) : 从 0 开始计数
示例查找第二行
html 代码:
header 1
value 1
value 2
jquery 代码:
$(tr:eq(1))
结果:
[ value 1
]
---------------------------------------------------------------------------------------
:gt(index)匹配所有大于给定索引值的元素
matches all elements with an index above the given one.
返回值array
参数index (number) : 从 0 开始计数
示例查找第二第三行,即索引值是1和2,也就是比0大
html 代码:
header 1
value 1
value 2
jquery 代码:
$(tr:gt(0))
结果:
[ value 1
, value 2
]
---------------------------------------------------------------------------------------
:lt(index)匹配所有小于给定索引值的元素
matches all elements with an index below the given one.
返回值array
参数index (number) : 从 0 开始计数
示例查找第一第二行,即索引值是0和1,也就是比2小
html 代码:
header 1
value 1
value 2
jquery 代码:
$(tr:lt(2))
结果:
[ header 1
, value 1
]
---------------------------------------------------------------------------------------
:header匹配如 h1, h2, h3之类的标题元素
matches all elements that are headers, like h1, h2, h3 and so on.
返回值array
示例给页面内所有标题加上背景色
html 代码:
header 1
contents 1
header 2
contents 2
jquery 代码:
$(:header).css(background, #eee);
结果:
[ header 1, header 2 ]
---------------------------------------------------------------------------------------
:animated匹配所有没有在执行动画效果中的元素
matches all elements that are currently being animated.
返回值array
示例只有对不在执行动画效果的元素执行一个动画特效
html 代码:
run
jquery 代码:
$(#run).click(function(){
  $(div:not(:animated)).animate({ left: +20 }, 1000);
});
---------------------------------------------------------------------------------------
:contains(text)匹配包含给定文本的元素
matches elements which contain the given text.
返回值array
参数text (string) : 一个用以查找的字符串
示例查找所有包含 john 的 div 元素
html 代码:
john resig
george martin
malcom john sinclair
j. ohn
jquery 代码:
$(div:contains('john'))
结果:
[ john resig
, malcom john sinclair
]
---------------------------------------------------------------------------------------
:empty匹配所有不包含子元素或者文本的空元素
matches all elements that are empty, be it elements or text.
返回值array
示例查找所有不包含子元素或者文本的空元素
html 代码:
value 1
value 2
jquery 代码:
$(td:empty)
结果:
[ , ]
---------------------------------------------------------------------------------------
:has(selector)匹配含有选择器所匹配的元素的元素
matches elements which contain at least one element that matches the specified selector.
返回值array
参数selector (selector) : 一个用于筛选的选择器
示例给所有包含 p 元素的 div 元素添加一个 text 类
html 代码:
hello
hello again!
jquery 代码:
$(div:has(p)).addclass(test);
结果:
[ hello
]
---------------------------------------------------------------------------------------
:parent匹配含有子元素或者文本的元素
matches all elements that are parents - they have child elements, including text.
返回值array
示例查找所有含有子元素或者文本的 td 元素
html 代码:
value 1
value 2
jquery 代码:
$(td:parent)
结果:
[ value 1 , value 1 ]
其它类似信息

推荐信息