jQuery 없이 JavaScript로 CSS 클래스를 제거하는 방법은 무엇입니까?

jQuery 없이 JavaScript로 CSS 클래스 제거

JavaScript를 사용하여 요소에서 CSS 클래스를 제거하는 것은 웹 개발에서 일반적인 작업입니다. jQuery 없이 이를 수행하려면 여러 가지 접근 방식이 있으며 가장 간단한 방법은 classList 속성을 사용하는 것입니다.

classList 사용

classList 속성은 간단한 인터페이스를 제공합니다. 요소의 클래스를 조작하는 데 사용됩니다. 특정 클래스를 제거하려면 간단히 제거() 메서드를 사용하세요.

ELEMENT.classList.remove("CLASS_NAME");

예

다음 HTML 및 CSS를 고려하세요.

<div>

.red {
  background: red;
}

classList를 사용하여 "el" 요소에서 "red" 클래스를 제거하려면 다음 코드를 사용하세요. 사용됨:

var el = document.getElementById("el");
el.classList.remove("red");

대체 접근 방식

classList가 가장 권장되는 접근 방식이지만 클래스를 제거하는 다음과 같은 대체 방법도 있습니다.

• 속성 조작: className 속성을 사용하지 않고 새 클래스 목록으로 설정 대상 클래스.
• 정규식 대체: replacement()를 사용하여 className 문자열에서 대상 클래스를 제거합니다.

그러나 이러한 방법은 덜 효율적입니다. classList를 사용하는 것에 비해 유연합니다.

위 내용은 jQuery 없이 JavaScript로 CSS 클래스를 제거하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!