Home > Web Front-end > JS Tutorial > Discuss in detail the difference and relationship between id selector and class selector in JQuery

Discuss in detail the difference and relationship between id selector and class selector in JQuery

巴扎黑
Release: 2017-06-20 16:57:20
Original
2256 people have browsed it

The following editor will bring you a cliché about the difference between jquery id selector and class selector. The editor thinks it is quite good, so I will share it with you now and give it as a reference for everyone. Let’s follow the editor and take a look.

The examples are as follows:


##

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <link href="style.css" rel="external nofollow" rel="external nofollow" rel="stylesheet" type="text/css"/>
  <script type="text/javascript" src="jquery-2.1.4.js"></script>
  <script type="text/javascript" src="dams.js">
  </script>
</head>
<body>
  <p class="box">hello</p>
  <p class="box">world</p>
</body>
</html>



$(function(){
  alert($(&#39;.box&#39;).size());  //返回2
});
Copy after login

## The #size() method returns the number of DOM objects

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <link href="style.css" rel="external nofollow" rel="external nofollow" rel="stylesheet" type="text/css"/>
  <script type="text/javascript" src="jquery-2.1.4.js"></script>
  <script type="text/javascript" src="dams.js">
  </script>
</head>
<body>
  <p id="box">hello</p>
  <p id="box">world</p>
</body>
</html>





$(function(){
  alert($(&#39;#box&#39;).size());  //只能获得一个id=box的DOM对象,返回1
});
Copy after login

that is: The id is unique. Even if there are multiple elements with the same id, the jquery selector can only get one of them. So: If you want to set an action on the id in jquery, the id is only allowed to appear once on the page. For CSS style, you can select all DOM objects with id=box in the page:

#box {

  color: red;


};
Copy after login

jQuery selector writing method and

CSS The selector

is very similar, but the function is different: CSS adds a single style after finding the element, while jquery adds an action

behavior

.

The above is the detailed content of Discuss in detail the difference and relationship between id selector and class selector in JQuery. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template