国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂

jQuery 基礎(chǔ)選擇器(二)

基本選擇器

2.png

群組選擇器

##請(qǐng)看下面程式碼:

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>選擇器</title>
	<script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
	<script type="text/javascript">
		$(function(){
			$("div,p,span").css("color","red");
		})
	</script>
</head>
<body>
	<div>php 中文網(wǎng)</div>
	<div>php 中文網(wǎng)</div>
	<div>php 中文網(wǎng)</div>

	<br><br>

	<p>php.cn</p>
	<p>php.cn</p>
	<p>php.cn</p>


	<br><br>
	<span>php 中文網(wǎng)</span>
	<span>php 中文網(wǎng)</span>
	<span>php 中文網(wǎng)</span>
</body>
</html>

請(qǐng)看下面一段實(shí)例

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>選擇器</title>
	<script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
	<script type="text/javascript">
		$(function(){
			
		})
	</script>
</head>
<body>
	<div id="dv">php 中文網(wǎng)</div>
	<div>php 中文網(wǎng)</div>
	<div>php 中文網(wǎng)</div>

	<br><br>

	<p>php.cn</p>
	<p class="p1">php.cn</p>
	<p class="p1">php.cn</p>


	<br><br>
	<span>php 中文網(wǎng)</span>
	<span>php 中文網(wǎng)</span>
	<span>php 中文網(wǎng)</span>
</body>
</html>

使用群組方式讓id是div的,class 是p1 還有span 標(biāo)籤變成紅色

代碼如下:

$("#dv,.p1,span").css("color","re??d");


後位選擇器

下面我們來寫一個(gè)實(shí)例:

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>選擇器</title>
	<script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
	<script type="text/javascript">
		$(function(){
			
		})
	</script>
</head>
<body>
	<ul>
		<li><a href="#">php 中文網(wǎng)</a></li>
		<li><a href="#">php 中文網(wǎng)</a></li>
	</ul>

	<a href="#">php 中文網(wǎng)</a>
	<a href="#">php 中文網(wǎng)</a>
</body>
</html>

#請(qǐng)看上面程式碼,我想讓li 標(biāo)籤的a 標(biāo)籤的顏色變成紅色

我們可以這樣寫,程式碼如下:

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>選擇器</title>
	<script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
	<script type="text/javascript">
		$(function(){
			$("ul li a").css("color","red");
		})
	</script>
</head>
<body>
	<ul>
		<li><a href="#">php 中文網(wǎng)</a></li>
		<li><a href="#">php 中文網(wǎng)</a></li>
	</ul>

	<a href="#">php 中文網(wǎng)</a>
	<a href="#">php 中文網(wǎng)</a>
</body>
</html>

看如上程式碼? ?我們?$("ul li a").css("color","re??d");


其實(shí)我們寫成$("ul a").css("color","re??d"); 也是可以的,但是為了準(zhǔn)確性,我們寫全會(huì)比較好,


例如:

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>選擇器</title>
	<script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
	<script type="text/javascript">
		$(function(){
			
		})
	</script>
</head>
<body>
	<ul>
		<li><a href="#">php 中文網(wǎng)</a></li>
		<li><a href="#">php 中文網(wǎng)</a></li>
		<a href="#">php.cn</a>
	</ul>

	<a href="#">php 中文網(wǎng)</a>
	<a href="#">php 中文網(wǎng)</a>
</body>
</html>

看以上程式碼,如果我們寫上$("ul a").css("color","re??d"); 那麼ul 下面的a 標(biāo)籤都會(huì)變成紅色

但是我們?cè)鞠胍氖莑i 標(biāo)籤下的?a ?標(biāo)籤變成紅色

所以,這時(shí)候我們需要寫全?即? $("ul li a").css("color","re??d ");

通配選擇器? *?

看如下程式碼:

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>選擇器</title>
	<script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
	<script type="text/javascript">
		$(function(){
			$("*").css("color","red");
		})
	</script>
</head>
<body>
	<ul>
		<li><a href="#">php 中文網(wǎng)</a></li>
		<li><a href="#">php 中文網(wǎng)</a></li>
		<a href="#">php.cn</a>
	</ul>

	<a href="#">php 中文網(wǎng)</a>
	<a href="#">php 中文網(wǎng)</a>


	<p> php.cn </p>
	<p> php.cn </p>
	<p> php.cn </p>


	<span>php 中文網(wǎng)</span>
</body>
</html>


#

繼續(xù)學(xué)習(xí)
||
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>選擇器</title> <script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script> <script type="text/javascript"> $(function(){ $("div,p,span").css("color","red"); }) </script> </head> <body> <div>php 中文網(wǎng)</div> <div>php 中文網(wǎng)</div> <div>php 中文網(wǎng)</div> <br><br> <p>php.cn</p> <p>php.cn</p> <p>php.cn</p> <br><br> <span>php 中文網(wǎng)</span> <span>php 中文網(wǎng)</span> <span>php 中文網(wǎng)</span> </body> </html>
提交重置程式碼