Window getComputedStyle() विधि

परिभाषा और उपयोग

getComputedStyle() विधि एचटीएमएल तत्व के गणना CSS गुण और मान प्राप्त करता है。

getComputedStyle() विधि CSSStyleDeclaration ऑब्जेक्ट वापस देता है。

गणना शैली

गणना शैली तत्व पर सभी शैली स्रोतों को लगाए जाने के बाद उपयोग में लाए जाने वाले शैली है。

शैली स्रोत: बाह्य और आंतरिक शैली पट्टिका, विरासत शैली और ब्राउज़र मूलभूत शैली。

दृष्टांत:

CSSStyleDeclaration ऑब्जेक्ट

प्रयोग

उदाहरण 1

तत्व का गणना पृष्ठभूमि रंग प्राप्त करें:

const element = document.getElementById("test");
const cssObj = window.getComputedStyle(element, null);
let bgColor = cssObj.getPropertyValue("background-color");

अपने आप प्रयोग करें

उदाहरण 2

तत्व से सभी गणना शैली प्राप्त करें:

const element = document.getElementById("test");
const cssObj = window.getComputedStyle(element, null);
let text = "";
for (x in cssObj) {
  cssObjProp = cssObj.item(x)
  text += cssObjProp + " = " + cssObj.getPropertyValue(cssObjProp) + "<br>";
}

अपने आप प्रयोग करें

उदाहरण 3

तत्व के पहले अक्षर का गणना फ़ॉन्ट आकार प्राप्त करें (उपयोग करते हुए प्रत्याय प्रतीक):

const element = document.getElementById("test"); const cssObj = window.getComputedStyle(element, ":first-letter")
let size = cssObj.getPropertyValue("font-size");

अपने आप प्रयोग करें

व्याकरण

window.getComputedStyle(element, pseudoElement)

पारामीटर

पारामीटर वर्णन
element आवश्यक। जिसके लिए गणना शैली प्राप्त करना है वाला तत्व。
pseudoElement वृद्धि। जिसके लिए प्राप्त किए जाने वाले प्रत्याय प्रतीक को प्राप्त करें।

वापसी गुण

क़िस्म वर्णन
ऑब्जेक्ट तत्व के सभी CSS गुण और मानों वाला CSSStyleDeclaration ऑब्जेक्ट。

getComputedStyle() विधि एवं style गुण के अंतर

getComputedStyle() विधि एवं HTMLElement के style गुण को तुलना करें: दूसरा केवल तत्व के इनलाइन शैली पहुंच देता है, आप द्वारा निर्दिष्ट किसी भी इकाई को प्रयोग किया जा सकता है, और, तत्व पर लगाया गया शैली पट्टिका के किसी भी जानकारी को देने में असमर्थ है।

ब्राउज़र समर्थन

सभी ब्राउज़रों का समर्थन है getComputedStyle()दश्युर

च्रोम आईई एज फायरफॉक्स सैफारी ऑपेरा
च्रोम आईई एज फायरफॉक्स सैफारी ऑपेरा
समर्थन 9-11 समर्थन समर्थन समर्थन समर्थन