jQuery中的ID和类选择器的区别
jQuery ID选择器 : #id选择器指定要选择的HTML元素的ID。它不应该以数字开头,而且id属性在一个文档中必须是唯一的,这意味着它一次只能使用一个。
语法:
$("#id")
- id是该元素的具体id。
例子:下面的代码演示了jQuery ID选择器。
<!DOCTYPE html>
<html>
<head>
<script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
<script>
(document).ready(function() {
("#paraID").css("background-color","red");
});
</script>
</head>
<body>
<h1 style="color:green">GeeksforGeeks</h1>
<p id="paraID">
jQuery #id selector is used for this p element.
</p>
</body>
</html>
输出:
jQuery类选择器:.class
选择器指定要选择的元素的类别。它不应该以数字开头。它为几个HTML元素提供样式。
语法:
$(".class")
- class是为HTML元素提供的类的名称。
例子:下面的代码演示了jQuery的类选择器。
<!DOCTYPE html>
<html>
<head>
<script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
<script>
(document).ready(function() {
(".pClass").css("background-color", "blue");
});
</script>
</head>
<body>
<h1 style="color:green">GeeksforGeeks</h1>
<p class="pClass">
jQuery.class selector is used for p element
</p>
<span class="pClass">
jQuery.class selector is used for span element
</span>
</body>
</html>
输出:
区分ID选择器和class选择器的概念:它们之间唯一的区别是,”id “在一个页面中是唯一的,它适用于一个HTML元素,而 “class “选择器可以适用于多个HTML元素。