JavaScript를 사용하여 HTML 요소에 클래스를 어떻게 추가합니까?

JavaScript를 사용하여 주어진 요소에 클래스를 추가하는 방법

기존 요소에 클래스를 추가하려면 다음과 같은 몇 가지 접근 방식을 활용할 수 있습니다. 브라우저 호환성 요구 사항에 따라 다릅니다.

최신 브라우저

최신 브라우저의 경우 classList 속성이 간단한 솔루션을 제공합니다.

element.classList.add("my-class");

이 코드는 지정된 요소에 "my-class" 클래스를 추가합니다. 클래스를 제거하려면 classList.remove를 사용하세요.

Internet Explorer 9 이하

Internet Explorer 9 이하와 같은 이전 브라우저의 경우 className 속성을 수동으로 수정할 수 있습니다. :

var d = document.getElementById("div1");
d.className += " otherclass";

새 클래스 이름 앞에 공백을 포함해야 합니다. 이렇게 하면 기존 클래스 이름과 충돌하는 것을 방지할 수 있습니다. class.

추가 참고 사항

• classList 속성은 Chrome, Firefox, Safari, Edge 및 Opera를 포함한 모든 주요 최신 브라우저에서 지원됩니다.
• classList 속성 및 기타 클래스 조작 방법에 대한 자세한 내용은 MDN 문서를 참조하세요. 요소.클래스이름.

위 내용은 JavaScript를 사용하여 HTML 요소에 클래스를 어떻게 추가합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!