• 회원가입
  • 로그인
  • 구글아이디로 로그인

[DOM_Element] JS - className 속성 ★★★ = 요소의 클래스명 반환/설정. (= className속성 = 클래스네임)

Element.className = 'class names' : 기존에 class가 없으면 추가해 넣고, 있으면 기존 것을 변경.

※ Element.classList.add('class names') : 기존 class에 새로운 클래스를 추가.


className 예제

 

<style>

.box {

  width: 300px;

  height: 100px;

  line-height:100px;

  background-color: tomato;

  text-align: center;

  font-size: 25px;

  color: white;

  margin-bottom: 10px;

}

</style>


<div id="hz">

   홈짱닷컴 Homzzang.com

</div>


<button onclick="homzzang()">클릭</button>


<script>

function homzzang() {

  document.getElementById("hz").className = "box";

}

</script>

 

결과보기

 

 


분류 제목
DOM_Event JS - inputType -
DOM_Event JS - isComposing -
DOM_Event JS - isTrusted -
DOM_Event JS - key 속성 -
DOM_Event JS - key 속성 -
DOM_Event JS - keyCode 속성 - 눌린 키보드키 유니코드 (= onkeypress, onkeydown, on…
DOM_Event JS - location -
DOM_Event JS - lengthComputable -
DOM_Event JS - loaded -
DOM_Event JS - metaKey -
DOM_Event JS - metaKey -
DOM_Event JS - MovementX -
DOM_Event JS - MovementY -
DOM_Event JS - newValue -
DOM_Event JS - newURL -
DOM_Event JS - offsetX 속성 - x좌표 (= 가로좌표 = 가로축좌표 = offsetX속성 = 오프셋엑스속성)
DOM_Event JS - offsetY 속성 - y좌표 (= 세로좌표 = 세로축좌표, offsetY속성, IE6)
DOM_Event JS - oldValue -
DOM_Event JS - oldURL -
DOM_Event JS - onemptied -
37/67
목록
찾아주셔서 감사합니다. Since 2012