常用的jQuery选择器

看书后整理的有关jQuery选择器的基本语法规则：

重点：

1、trigger方法，页面加载后即可触发该方法，解决页面载入时就触发onchange函数比较有效

        2、当id中含有特殊字符时如何选取jQuery对象

 

1.基本选择器
	选择 所有的元素
		$('*').css("background","#aaa")
	选择 所有的span元素和id为two的div元素
		$('span,#two').css("background","#bfa")
	重置页面元素
		$("*").removeAttr("style");
		$("div[class=none]").css({"display","none"});
2.层次选择器
	选择body内所有的div元素
		$('body div').css("background","#bfa");
	在body内的选择 元素名是div 的子元素.
		$('body>div').css("background","#bfa");
	选择 所有class为one 的下一个div元素.
 		 $('.one + div').css("background","#bbffaa");
	选择 id为two的元素后面的所有div兄弟元素.
 		$('#two ~ div').css("background","#bbffaa");
3.内容过滤选择器
	选择文本中还有“中国的”div元素
		$('div:contains(中国)').css("background","#bbffaa");
	选取不包含子元素(或者文本元素)的div空元素
		$('div:empty').css("background","#bbffaa");
	选取含有class为mini元素 的div元素.
		$('div:has(.mini)').css("background","#bbffaa");
	选取含有子元素(或者文本元素)的div元素.
		 $('div:parent').css("background","#bbffaa");
4.可见性过滤
	//所有body 中的隐藏域
	$('body :hidden').length
	//所有input中的隐藏域
	$('input:hidden').length
	//选取所有可见的元素
	$('div:visble').css("background","#BBF");
5.属性选择器
	选取含有 属性title 的div元素.
	$('div[title]').css("background","#aaa");
	//选取 属性title值等于 test 的div元素.
	$('div[title=test]').css("background","#aaa")
	//选取 属性title值 以 te 开始 的div元素.
	$('div[title=^te]').css("background","#aaa")
	 //选取 属性title值 以 est 结束 的div元素.
	$('div[title$=est]').css("background","#aaa")
	//组合属性选择器,首先选取有属性id的div元素，然后在结果中 选取属性title值 含有 es 的元素.
	$("div[id][title*=es]").css("background","#aaa");
6.子元素过滤选择器
	选取每个父元素下的第2个子元素
	$('div.one :nth-child(2)')
	//选取每个父元素下的第一个子元素
	$('div.one :frist-child')
	如果父元素下的仅仅只有一个子元素，那么选中这个子元素
	$('div.one :only-child')
7.表单对象属性过滤器
	//选择表单中 可用的input
	$("#form1 input:enabled").val("dd");

	//选择表单内不可用的input
	$("#form1 input:disabled").val("aa");

	//选择表单中 可用的text
	$("#form1 :text")
	$("#form1 :checkbox")	
	
	//表单提交
	  $("form").submit(function () { return false; }); // return false;不能提交.

	//使用：checked选择器，来选择多选框
		$(":checkbox[name=newsletter1]").click(f1) //f1为自定义函数
	   var n =$("input:checked[name=newslettre1]").length;//获取所有选择元素的个数
	//使用：selected选择器，来操作下拉列表
	$("select").change(function(){
		var str="";
		$("select :selected").each(function(){
			str+=$(this).text()+","; //注意这里用text（）取值
			})
		$("div").eq(1).html("<strong>你选中的是："+str+"</strong>");
	}).trigger('change');
		//trigger('change')意思是select加载后，马上执行onchange事件。也可以用.change()代替
8.选择器中含有特殊字符
	例如：
		<div id="id.a">aa</div>
		<div id="id#b">bb</div>
		<div id="id[1]">cc</div>
	var $a = $('#id\\.a');//转义特殊字符'.'获取jQuery对象
	var $b = $('#id\\#b');//
	var $c = $('#id[1\\]')