jquery属性选择器

jquery属性选择器

一、[attribute] 属性选择器

1、匹配包含给定属性的元素，用于判断拥有某个属性的元素
 

2、例如

查找所有含有 id 属性的 li 元素

<li>
  <p>Hello!</p>
</li>
<li id="test2"></li>

$("li[id]")

//结果

			

				<li id="test2"></li>
			

				 
		

二、[attribute=value] 属性选择器

1、匹配给定的属性的值是value的元素

2、例如

查找所有 name 属性值是 newsletter 的 input 元素

<input type="checkbox" name="newsletter" value="Hot Fuzz" />
<input type="checkbox" name="newsletter" value="Cold Fusion" />
<input type="checkbox" name="accept" value="Evil Plans" />


$("input[name='newsletter']").attr("checked", true);



					

						//结果  
					

						  <input type="checkbox" name="newsletter" value="Hot Fuzz" checked="true" /> 
					

						  <input type="checkbox" name="newsletter" value="Cold Fusion" checked="true" /> 
					

						 
				

	

		 


	三、[attribute!=value] 属性选择器

	

	1、匹配给定的属性的值不等于value的元素

	 

	2、例如

	查找所有 name 属性不是 newsletter 的 input 元素

	

		 
	

		

			

<input type="checkbox" name="newsletter" value="Hot Fuzz" />
<input type="checkbox" name="newsletter" value="Cold Fusion" />
<input type="checkbox" name="accept" value="Evil Plans" />


$("input[name!='newsletter']").attr("checked", true);



			

				//结果:  
			

				  <input type="checkbox" name="accept" value="Evil Plans" checked="true" /> 
			

				 
		
	


	 

	四、[attribute^=value] 属性选择器

	1、匹配给定的属性的值是以value开头的元素

	 

	2、例如

	查找所有 name 以 'news' 开始的 input 元素

	

		 
	

		

			

<input name="newsletter" />
<input name="milkman" />
<input name="newsboy" />


$("input[name^='news']")


//结果:

			

				<input name="newsletter" />, <input name="newsboy" /> 
			

				
		
	


	 

	五、[attribute$=value] 属性选择器

	 

	1、匹配给定的属性的值是以value结尾的元素

	 

	2、例如

	查找所有 name 以 'letter' 结尾的 input 元素

	

		

			

				 
			

				

					

<input name="newsletter" />
<input name="milkman" />
<input name="jobletter" />

$("input[name$='letter']")



					

						//结果: 
					

						  <input name="newsletter" /> <input name="jobletter" /> 
					

						 
				
			
		
	
	



	 

	 

	六、[attribute*=value] 属性选择器

	

	1、匹配给定的属性的值包含value的元素

	 

	2、例如

	查找所有 name 包含 'man' 的 input 元素

	

		 
	

		

			

<input name="man-news" />
<input name="milkman" />
<input name="letterman2" />
<input name="newmilk" />


$("input[name*='man']")



			

				结果:  
			

				   <input name="man-news" /> <input name="milkman" /> <input name="letterman2" /> 
			

				 
		
	


	 

	 

	七、[selector1][selector2][selectorN] 多个属性选择器

	1、复合属性选择器，需要同时满足多个条件时使用，多个属性值取交集

	 

	2、例如

	 

	(1)、查询一个input,类型是checkbox，name是chkName

	$("input[type=checkbox][name=chkName]")

	 

	(1)、找到所有含有 id 属性，并且它的 name 属性是以 man 结尾

	

		

			

				 
			

				

					

<input id="man-news" name="man-news" />
<input name="milkman" />
<input id="letterman" name="new-letterman" />
<input name="newmilk" />


$("input[id][name$='man']")


//结果:

<input id="letterman" name="new-letterman" />

					

						 
				
			
		
	


	 
标签：
jquery