JavaScript를 사용하여 동적으로 CSS 클래스 생성 및 적용 JavaScript는 새로운 CSS 클래스 생성 및 해당 클래스 생성을 포함하여 CSS를 동적으로 조작하는 기능을 제공합니다. HTML 요소 및 컨트롤에 대한 후속 적용. CSS 생성 클래스 JavaScript를 사용하여 새 CSS 클래스를 만들려면 document.createElement('style') 메서드를 활용하세요. 이렇게 하면 새로운 HTML 문서 내의 요소입니다. 그런 다음 스타일 유형을 지정하려면 유형 속성을 'text/css'로 설정해야 합니다. 마지막으로 innerHTML 속성을 사용하여 클래스에 대한 CSS 규칙을 정의합니다.</p> <p><strong>CSS 클래스 적용</strong></p> <p>CSS 클래스가 생성되면 이를 다음에 적용할 수 있습니다. HTML 요소 또는 컨트롤. className 속성을 사용하여 원하는 요소의 클래스 속성을 설정합니다. 이렇게 하면 요소가 <style>에 정의된 CSS 클래스와 연결됩니다. element.</p> <p><strong>예</strong></p> <p>다음 코드 조각은 'cssClass'라는 CSS 클래스를 동적으로 생성하고 이를 <div> 요소:</p> <div class="code" style="position:relative; padding:0px; margin:0px;"><pre>var style = document.createElement('style'); style.type = 'text/css'; style.innerHTML = '.cssClass { color: #f00; }'; document.getElementsByTagName('head')[0].appendChild(style); document.getElementById('someElementId').className = 'cssClass';</pre><div class="contentsignin">로그인 후 복사</div></div> <p>HTML에서 다음 코드를 사용하여 <div> 'cssClass' 스타일이 적용될 요소:</p> <div class="code" style="position:relative; padding:0px; margin:0px;"><pre><div></pre><div class="contentsignin">로그인 후 복사</div></div> <p>이 접근 방식을 사용하면 CSS 클래스를 동적으로 생성 및 적용할 수 있으므로 특정 조건이나 이벤트에 따라 HTML 요소 및 컨트롤의 스타일을 제어할 수 있습니다. JavaScript 애플리케이션에서.</p>
