w3.css

클래스 추가

JavaScript를 사용하여 요소에 클래스 이름을 추가하는 방법을 알아보자.

클래스 추가

1단계) HTML 추가

id=”myDIV”로 div 요소에 클래스 이름을 추가한다(이 예에서는 버튼을 사용하여 클래스를 추가한다).

<button onclick="myFunction()">Try it</button>

<div id="myDIV">
  This is a DIV element.
</div>

2단계) CSS 추가

지정된 클래스 이름의 스타일을 지정한다.

.mystyle {
  width: 100%;
  padding: 25px;
  background-color: coral;
  color: white;
  font-size: 25px;
}

3단계) ​​JavaScript 추가

id=”myDIV”를 가진 <div> 요소를 가져와서 여기에 “mystyle” 클래스를 추가한다.

function myFunction() {
  var element = document.getElementById("myDIV");
  element.classList.add("mystyle");
}

Mingg`s Diary

밍구

공부 목적 블로그

https://maz.kr

모든 포스트 보기