[CSS_Objects] JS - parentRule 속성 - CSS 선택자 및 선언내용 반환 (= 패런트룰 속성) (IE9+)

1. parentRule 예제 - CSS 선택자 및 선언내용 반환
2. parentRule 정의
3. parentRule 구문

parentRule 예제 - CSS 선택자 및 선언내용 반환 

 

<style>

h1 {color: red;font-size: 50px;}

</style>

<script>

function homzzang() {

  var s = document.styleSheets[0].rules[0].style; // [object CSSStyleDeclaration]

  var ruleObj = s.parentRule; // [object CSSStyleRule]

  var css = ruleObj.cssText; // h1 { color: red; font-size: 50px; }

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

}

</script> 

<h1>홈짱닷컴 Homzzang.com</h1>

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

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

 

결과보기 (결과값: h1 { color: red; font-size: 50px; })

parentRule 정의

 

CSS 규칙 집합 (= 선택자와 선언블록) 담긴 CSSStyleRule 객체 반환. 

 

---

 

1.

IE9 이상 주요 최신브라우저 지원.

 

2.

DOM 버전: CSS Object Model

 

parentRule 구문

 

object.parentRule 

 

---

[반환값]

 

CSSStyleRule 객체 반환.