HTML DOM에서 id와 class는 모두 요소 선택자이며 이러한 매개변수에 할당된 이름을 기반으로 요소를 식별하는 데 사용됩니다.
다음은 Id와 Class의 중요한 차이점입니다.
| Sr. 아니요. | 키 | ID | 클래스 |
|---|---|---|---|
| 1 | 구문 | 요소 ID 이름은 HTML에서 "#" 기호로 시작하고 뒤에 고유한 이름이 할당됩니다. | 반면에 요소에 할당된 클래스는 이름이 "."로 시작합니다. 뒤에 클래스 이름이 옵니다. |
| 2 | 선택기 | 요소에는 하나의 ID 선택기만 연결할 수 있습니다. | 여러 클래스 선택기를 요소에 연결할 수 있습니다. |
| 3 | 고유성 | Id는 페이지에서 고유하며 최대 하나의 요소에만 적용할 수 있습니다. | 클래스는 여러 요소에 적용할 수 있으므로 한 페이지에 여러 번 적용될 수 있습니다. |
Id 대 클래스의 예
Id.html
<!DOCTYPE html>
<html>
<head>
<title>
Id demo
</title>
<style>
#idDemo{
color:green;
font-size:25px;
}
</style>
</head>
<body style="text-align:center">
<h1>Get element by Id</h1>
<p id="idDemo">Demo for Id selector</p>
</body>
</html> Class.html
<!DOCTYPE html>
<html>
<head>
<title>
Class demo
</title>
<style>
.classDemo{
color:orange;
font-size:25px;
}
</style>
</head>
<body style="text-align:center">
<h1>Get element by class</h1>
<p class="classDemo">Demo for class selector</p>
</body>
</html>