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 ਪ੍ਰਾਪਤੀ ਦਾ ਅਲਗ ਹੋਣਾ

ਜੀਤ ਗੋਲਿਕ ਮੇਥਡ ਅਤੇ HTMLElement ਦੇ style ਪ੍ਰਾਪਤੀ ਨੂੰ ਤੁਲਨਾ ਕਰੋ: ਅੰਤਿਮ ਹੀ ਇਲੈਕਟਰਨ ਦੇ ਇੰਲਾਈਨ ਸਟਾਈਲ ਨੂੰ ਪ੍ਰਾਪਤ ਕਰਦਾ ਹੈ, ਤੁਸੀਂ ਵਰਤਣ ਵਾਲੇ ਕੋਈ ਵੀ ਇਕਾਈ ਨੂੰ ਦਰਸਾਉਣਾ ਹੈ, ਅਤੇ, ਇਲੈਕਟਰਨ ਦੇ ਸਟਾਈਲ ਸ਼ੈਟ ਸਟਾਈਲ ਦੀ ਕੋਈ ਸੂਚਨਾ ਦੇਣ ਵਾਲਾ ਨਹੀਂ ਹੈ。

ਬਰਾਉਜ਼ਰ ਸਮਰਥਨ

ਸਾਰੇ ਬਰਾਉਜ਼ਰਾਂ ਦਾ ਸਮਰਥਨ getComputedStyle()ਪੰਜਾਬੀ :

ਚਰਮ ਆਈਈ ਐਜ਼ ਫਾਇਰਫਾਕਸ ਸੈਫਾਰੀ ਓਪਰਾ
ਚਰਮ ਆਈਈ ਐਜ਼ ਫਾਇਰਫਾਕਸ ਸੈਫਾਰੀ ਓਪਰਾ
ਸਮਰਥਨ 9-11 ਸਮਰਥਨ ਸਮਰਥਨ ਸਮਰਥਨ ਸਮਰਥਨ