돔 엘리먼트의 클래스 이름 다루기 - classList

<p></p>

 

ele.classList.add('a');

// 엘리먼트에 a라는 클래스 이름을 추가한다.

// <p class="a"></p>

 

ele.classList.remove('a');

// 엘리먼트에 a라는 클래스 이름을 지운다.

// <p></p>

 

ele.classList.replace('a', 'b');

// 엘리먼트의 클래스 이름 a를 b로 바꾼다.

 

ele.classList.toggle('a');

// 엘리먼트의 클래스 이름에 a가 있으면 a를 추가하고 없으면 지운다.

 

ele.classList.contains('a');

// 엘리먼트의 클래스 이름에 a가 있으면 true, 없으면 false를 반환한다.

 

ele.classList.item(0); 

// 엘리먼트의 클래스 이름의 0번째 인덱스에 있는 클래스 이름을 반환한다.

// <p class="a b c"></p>

// a는 0번째, b는 1번째, c는 3번째

 

ele.classList.length;

// 엘리먼트의 클래스 이름의 개수를 반환한다.

// 3