JQ常用的三種選擇器
摘要：
首先，大前提是在html種匯入jq的js，然後分別展示
1元素選擇器
元素就是 html種定義的標籤，如p段落，
程式碼如下：
<!DOCTYPE html>
<html>
<head>
<meta ...
首先，大前提是在html種匯入jq的js，然後分別展示
1元素選擇器
元素就是 html種定義的標籤，如p段落，
程式碼如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>元素選擇器</title>
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js">
</script>
<script>
$(document).ready(function(){//一訪問html就載入此函式
$("button").click(function(){//點選事件觸發
$("p").hide();
});
});
</script>
</head>
<body>
<h2>這是一個標題</h2>
<p>這是一個段落。</p>
<p>這是另一個段落。</p>
<button>點我</button>
</body>
</html>
#id選擇器
id就很明白了，在上面的每一個元素都可以給他新增一個唯一id
程式碼如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>#id選擇器</title>
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("#cs").hide();
});
});
</script>
</head>
<body>
<h2>這是一個標題</h2>
<p>這是一個段落。</p>
<p id="cs">這是另一個段落。</p>
<button>點我</button>
</body>
</html>
3.class選擇器
class的範圍在id和元素之間，元素最大，一種元素可以有多個class，id最小
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>.class選擇器</title>
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("button").click(function(){
$(".cs").hide();
});
});
</script>
</head>
<body>
<h2 class="cs">這是一個標題</h2>
<p class="cs">這是一個段落。</p>
<p id="css">這是另一個段落。</p>
<button>點我</button>
</body>
</html>
效果顯示：
點選前
點選後，對應的元素就消失了
該