• 회원가입
  • 로그인

[CSS_Objects] JS - style.length 속성 - 스타일 선언 개수 반환 (= 스타일렝스 속성)

목차
  1. style.length 예제 - 요소의 스타일 속성 개수
  2. style.length 정의
  3. style.length 구문
  4. style.length 예제 - 요소의 스타일 속성 모두 표시

 

style.length 예제 - 요소의 스타일 속성 개수 

 

<h1 style="color:red; font-size: 50px">Homzzang.com</h1>


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

<p id="demo"></p>


<script>

function homzzang() {

  var h1 = document.getElementsByTagName("h1")[0];

  var x = h1.style.length;

  document.getElementById("demo").innerHTML = x;

}

</script> 

 

결과보기 (결과값: 2)

 

style.length 정의

 

지정 요소의 인라인스타일에 선언된 속성 개수 반환.

 


 

1. 읽기 전용  

2. 모든 브라우저 지원. 

 

 

 

style.length 구문

 

element.style.length

 

 

style.length 예제 - 요소의 스타일 속성 모두 표시

 

<h1 style="color:red; font-size: 50px">Homzzang.com</h1>


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

<p id="demo"></p>


<script>

function homzzang() {

  var h1, i, txt = "";

  h1 = document.getElementsByTagName("h1")[0];

  for (i = 0; i < h1.style.length; i++) {

    txt += h1.style.item(i) + "<br>";

  }

  document.getElementById("demo").innerHTML += txt;

}

</script>

 


방문 감사합니다. (즐겨찾기 등록: Ctrl + D)

찾아주셔서 감사합니다. Since 2012