JQuery 基本選擇器

阿新 • • 發佈：2021-01-18

技術標籤：# 6.2 JQuery jquery 基本選擇器 ID選擇器類選擇器元素選擇器

ID選擇器 : #ID的名稱
類選擇器: 以 . 開頭 .類名
元素選擇器: 標籤的名稱
萬用字元選擇器: *
選擇器,選擇器: 選擇器1,選擇器2

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" href="../../../css/style.css" 
 />
		<!--引入JQ的檔案-->
		<script type="text/javascript" src="../../../js/jquery-1.11.0.js" ></script>
		<!--
			- ID選擇器 :     #ID的名稱
			- 類選擇器:     以 . 開頭  .類名
			- 元素選擇器:    標籤的名稱
			- 萬用字元選擇器:   * 
			- 選擇器,選擇器:  選擇器1,選擇器2
		-->
		<script>
			//文件載入事件,頁面初始化的操作 

			$(function(){
				//初始化操作: 給按鈕繫結事件
				$("#btn1").click(function(){
					$("#two").css("background-color","palegreen");					
				});
				
				//找出mini類的所有元素
				$("#btn2").click(function(){
					$(".mini").css("background-color","palegreen" 
);					
				});
				$("#btn3").click(function(){
					$("div").css("background-color","palegreen");					
				});
				$("#btn4").click(function(){
					$("*").css("background-color","palegreen");
					
				});
				/*選擇器分組*/
				
				//找出mini類 和 span元素
				$("#btn5").click(function(){
					$(".mini,span").css("background-color","palegreen");
				});
			});
		</script>
	</head>
	<body>
		<input type="button" value="找出ID為two的元素" id="btn1" />
		<input type="button" value="找出mini類的所有元素" id="btn2" />
		<input type="button" value="找出所有div元素" id="btn3" />
		<input type="button" value="萬用字元選擇器" id="btn4" />
		<input type="button" value="找出mini類 和 span元素" id="btn5" />
		
		<br />
		<div id="one">
			<div class="mini">1-1</div>
		</div>
		<div id="two">
			<div class="mini">2-1</div>
			<div class="mini">2-2</div>
		</div>
		<div id="three">
			<div class="mini">3-1</div>
			<div class="mini">3-2</div>
			<div class="mini">3-3</div>
		</div>
		<span id="four">span</span>
	</body>
</html>

在這裡插入圖片描述

JQuery 基本選擇器

技術標籤：# 6.2 JQueryjquery基本選擇器ID選擇器類選擇器元素選擇器 ID選擇器 : #ID的名稱類選擇器: 以 . 開頭 .類名元素選擇器: 標籤的名稱萬用字元選擇器: *選擇器,選擇器: 選擇器1,選擇器2

jquery基本選擇器

1.id選擇器 $(“#ids”)其中的ids是一個標籤的id值而$(“#ids”)就是滿足條件的那個標籤！

jQuery選擇器之基本選擇器（1）

jQuery選擇器之基本選擇器（1）基本選擇器主要有五種:分別為#id選擇器、.class選擇器、element選擇器、*選擇器和組合選擇器。

jQuery之選擇器

概述說明：　　選擇器本身只是一個有特定語法規則的字串，沒有實質用處。它的基本語法規則使用的就是CSS的選擇器語法，並對其進行了擴充套件。只有呼叫$()，並將選擇器作為引數傳入才能起作用。

JQuery 04 選擇器1

Jquery有多達數十種選擇器，本章節把工作中會用到的常用選擇器列出來，並逐一解釋。

JQuery 04 選擇器2

示例8: 屬性 $(selector[attribute]) 滿足選擇器條件的有某屬性的元素$(selector[attribute=value]) 滿足選擇器條件的屬性等於value的元素$(selector[attribute!=value]) 滿足選擇器條件的屬性不等於value的元素$(se