jQuery (제이쿼리) - jQuery 클래스 관련 함수

이번 글에서는 클래스에 관련된 함수들을 모아보도록 하자.

1. addClass() : 해당 제이쿼리 객체에 클래스를 추가한다.

.this { font-size : 20px; }

$(document).ready(function() {
	$("#this").addClass("this");
});

디스 이즈 스파르타!!

2. removeClass() : 해당 제이쿼리 객체의 클래스를 삭제한다.

.this { font-size : 20px; }

$(document).ready(function() {
	$("#this").removeClass("this");
});

디스 이즈 스파르타!!

3. toggleClass() : 해당 제이쿼리 객체에 클래스가 있다면 삭제하고 없다면 추가한다.

.this { font-size : 20px; }

$(document).ready(function() {
	$("#this").click(function() {
    	$("#this").toggleClass("this");
    });
});

디스 이즈 스파르타!!

4. hasClass() : 클래스가 있다면 true, 없으면 false 를 리턴한다.

.this { font-size : 20px; }

$(document).ready(function() {
	$("#this").click(function() {
    	$("#this").toggleClass("this");
        
        if($("#this").hasClass("this")) {
        	alert("클래스가 생성 했습니다!");
        } else {
        	alert("클래스를 삭제 했습니다!");
        }
    });
});

디스 이즈 스파르타!!