[JavaScript] 특정클래스의 존재여부로 클래스 추가 삭제~addClass,removeClass,hasClass~(자바스크립트 제이쿼리)_jquery_-Add/delete a class based on the existence of a specific class-++

+특정클래스의 존재여부로 클래스 추가 삭제~addClass,removeClass,hasClass~


* 예제)

1. 소스 코드 영역

 <div class="test">테스트입니다.</div>

<button class="btn">변경</button>


2. 스타일 영역

.test.active {

color:red;

}


3. 스크립트 영역

$(document).ready(function() {

   $(".btn").off("click").on("click", function() {

       // test class를 포함하는 DOM 객체가 active class를 포함하면 true 아니면 false를 반환

       if ($(".test").hasClass("active")) { 

            // active class 제거

            $(".test").removeClass("active");

       }

       else {

            // active class 추가

            $(".test").addClass("active");

       }

   });

});


- 출처

https://dreamjy.tistory.com/12

댓글

T O P