getComputedStyle()
Misol
Elementning hisoblangan fon rangini oling:
const element = document.getElementById("test");
const cssObj = window.getComputedStyle(element, null);
let bgColor = cssObj.getPropertyValue("background-color");
O‘zingiz sinab ko‘ring »
Quyida ko‘proq misollar.
Tavsif
getComputedStyle() metodi HTML elementning hisoblangan CSS xususiyatlari va qiymatlarini oladi.
getComputedStyle() metodi
CSSStyleDeclaration object qaytaradi.
Hisoblangan uslub (Computed Style)
Hisoblangan uslub — barcha uslub manbalari qo‘llanilgandan so‘ng elementda ishlatiladigan uslub.
Uslub manbalari: tashqi va ichki uslublar jadvallari (style sheets), meros qilingan uslublar va brauzerning standart uslublari.
Shuningdek qarang:
Sintaksis
window.getComputedStyle(element, pseudoElement)
Parametrlar
| Parametr | Tavsif |
| element | Majburiy. Hisoblangan uslubi olinadigan element. |
| pseudoElement | Ixtiyoriy. Olinadigan psevdoelement. |
Qaytariladigan qiymat
| Tip | Tavsif |
| Obyekt | Elementning barcha CSS xususiyatlari va qiymatlarini o‘z ichiga olgan CSSStyleDeclaration obyekti. |
Ko‘proq misollar
Elementdan barcha hisoblangan uslublarni oling:
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>";
}
O‘zingiz sinab ko‘ring »
Elementdagi birinchi harfning hisoblangan shrift o‘lchamini oling (psevdoelement yordamida):
const element = document.getElementById("test"); const cssObj = window.getComputedStyle(element, ":first-letter")
let size = cssObj.getPropertyValue("font-size");
O‘zingiz sinab ko‘ring »
Brauzerlarda qo‘llab-quvvatlash
getComputedStyle() barcha brauzerlarda qo‘llab-quvvatlanadi:
| Chrome | Edge | Firefox | Safari | Opera | IE |
| Ha | Ha | Ha | Ha | Ha | 9-11 |
W3Schools Pathfinder
Yutuqlaringizni kuzating – bu bepul!