jQuery的选择器集合

jquery

– 一、jQuery的引入

1. 本地引入

<script type="text/javascript"src="jquery.js"></script>

2. 外部引入

<script type="text/javascript" 
src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.min.js">
</script>

– 二、jQuery选择器

1. 元素名选择器

			var x=$('input');
			console.log(x);

2. 类选择器

			var x=$('.box');
			console.log(x);

3. id选择器

			var x=$('#a');
			console.log(x);

4. 所有

			var x=$('*p');
			console.log(x);

5. 分组匹配

			var x=$('p,img,input');
			console.log(x);

6. 后代所有

			var x=$('div h1');
			console.log(x);

7. 子代

			var x=$('.box>img');
			console.log(x);

8. 兄弟

			var x=$('#a+p');
			console.log(x);

9. 下一个

			var x=$('#a').next();
			console.log(x);

10. 之间

			var x=$('#a~.z');
			console.log(x);

11. 后面所有

			var x=$('#a').nextAll('.z');
			console.log(x);

12. 同元素第一个

			var x=$('.box>p:first');
			console.log(x);

13. 同元素最后一个

			var x=$('.box>p:last');
			console.log(x);

14. 除了这个元素的所有元素

			var x=$('.box>:not(img)');
			console.log(x);

15. 索引是偶数的所有元素

			var x=$('.box>:even');
			console.log(x);

16. 索引是基数的所有元素

			var x=$('.box>:odd');
			console.log(x);

17. 根据索引查找元素

			var x=$('.box>:eq(5)');
			console.log(x);

18. 选择索引大于这个数的所有元素

			var x=$('.box>:gt(2)');
			console.log(x);

19. 选择索引小于这个数的所有元素

			var x=$('.box>:lt(2)');
			console.log(x);

20. 选择所有的标题标签

			var x=$('.box>:header');
			console.log(x);

21. 选择含有文本内容的元素

			var x=$(':contains(text)');
			console.log(x);

22. 选择不包含子元素或空文本集

			var x=$('.box>:empty');
			console.log(x);

23. 选择包含p标签的所有元素

			var x=$(':has(p)');
			console.log(x);