jQuery中的ID和类选择器的区别

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中的ID和类选择器的区别

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>

输出:

jQuery中的ID和类选择器的区别

区分ID选择器和class选择器的概念:它们之间唯一的区别是,”id “在一个页面中是唯一的,它适用于一个HTML元素,而 “class “选择器可以适用于多个HTML元素。

Python教程

Java教程

Web教程

数据库教程

图形图像教程

大数据教程

开发工具教程

计算机教程