JQuery(一)基本选择器

基本

(一) #id

根据给定的ID匹配一个元素。

使用任何的元字符作为名称的文本部分，它必须被两个反斜杠转义：\\。

<!--HTML-->
<span id="foo:bar"></span>
<span id="foo[bar]"></span>
<span id="foo.bar"></span>

<!--JQuery-->
#foo\\[bar\\]

(二) element

一个用于搜索的元素。指向 DOM 节点的标签名。

(三)class

一个用以搜索的类。一个元素可以有多个类，只要有一个符合就能被匹配到。

(四)*

匹配所有元素

多用于结合上下文来搜索。

(五)selector1,selector2,selectorN

将每一个选择器匹配到的元素合并后一起返回。

你可以指定任意多个选择器，并将匹配到的元素合并到一个结果内。

<!DOCTYPE html>
<html>
  <head>
    <title>selectorl.html</title>
	
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
 	<script type="text/javascript" src="js/jquery-1.8.3.js"></script>
	<script type="text/javascript" src="js/jquery.min.js"></script>
	<script type="text/javascript">
	$(function(){
		$("button").click(function(){
		/* 	$("#aselector").css("color","red");
			$("#bselector").css("color","blue");
			$(".cClass").css("color","blue");
			$("*").css("color","blue"); 
			$("#aselector,#bselector").css("color","blue");
		*/	
		});
	});
	</script>
  </head>
  
  <body>
    <div>
    	<h3>jQuery选择器</h3>
    	<p>#id  id选择器--  有多个id相同的选择器则返回第一个
			element  元素选择器
			.class  class选择器
			*  通配选择器
			selector1,selector2,selectorN  群组选择器
		</p>
		<p>
		ancestor descendant 后代选择器
		parent > child 子选择器
		prev + next 紧接的下一个选择器
		prev ~ siblings 以后的所有兄弟元素
		</p>
    </div>
    <div>
    	<p>id 选择器</p>
    	<button>按钮</button>
    	<ul>
    		<li>
    			<ul>
    				<li id="aselector">this is  a id selector</li>
    				<li id="bselector">this is  b id selector</li>
    				<li class="cClass">this a class selector</li>
    				<li class="cClass">this a class selector ddddd</li>
    				<li></li>
    			</ul>
    		</li>
    	</ul>
    </div>
  </body>
</html>

JQuery(一)基本选择器

基本

猜你喜欢