전역 속성 - CLASS와 ID

전역 속성(Global Attributes)

모든 HTML 요소에서 공통적으로 사용 가능한 속성.

 

1. class

공백으로 구분된 요소의 별칭을 지정.
CSS 혹은 JavaScript의 요소 선택기(CSS 선택자나 GetElementsByClassName, QuerySelectorAll 같은)를 통해서 요소를 선택하거나 접근.

 

--> 다음과 같이 중복해서 사용 가능 O

<div class = "section"></div>
<div class = "section"></div>
<div class = "section"></div>
<div class = "section"></div>

//스타일 지정
.section{
            width : 100px;
            color : red;
            background : blue;
        }

const section = document.querySelector('.section'); //클래스가 section인 요소를 찾는다.

 

 

2. id

문서에서 고유한 식별자(idenifier, ID)를 정의.
CSS 혹은 JavaScript의 요소 선택기(CSS 선택자나 GetElementsByClassName, QuerySelectorAll 같은)를 통해서 요소를 선택하거나 접근.

 

--> 다음과 같이 중복해서 사용 불가능 X

<div id = "section"></div>
<div id = "section"></div>

//스타일 지정
#section {
            height : 200px;
            position : red;
        }

const sectionId = document.getElementById('section'); //아이디가 section인 요소를 찾는다.