Metodi ya Window getComputedStyle()

  • Ukurasa wa kuzungumza
  • Ukurasa wa mpito
  • Rudi kufikia ukurasa wa juu Window 对象

Ufafanuzi na matumizi

getComputedStyle() Method inafikia hatua ya CSS ya kifupi na ukweli ya kifupi ya HTML.

getComputedStyle() Method inatuma Mfano wa CSSStyleDeclaration.

Hatua ya kifupi

Hatua ya kifupi inaelewa kama hatua ya kifupi inayotumiwa kwenye kifupi baada ya kufikia mababu yote ya hatua ya stili.

Mababu ya hatua ya stili: maelezo ya kifupi ya nje na ndani, hatua ya kuzalisha na hatua ya kufikia kwa msingi wa kifupi.

Tafuta pia:

Sarafu ya CSSStyleDeclaration

Mfano

Mfano 1

Pata hatua ya mabara ya kifupi ya kifupi ya kifupi.

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

Jaribu kwa mwenyewe

Mfano 2

Pata hatua ya kila maelezo ya kifupi kutoka kifupi.

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>";
}

Jaribu kwa mwenyewe

Mfano 3

Pata ukurasa wa hatua ya fonti ya kifupi cha kwanza cha kifupi (kwa tukio la pseudelement):

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

Jaribu kwa mwenyewe

Inayotumiwa kwa sababu ya kina

window.getComputedStyle(element, pseudoElement)

Makusanyiko

Makusanyiko Kuelewa
element Inayohitajika. Kifupi kinayotafutwa kwa uwanja wa hatua ya stili.
pseudoElement Inayochaguliwa. Pseudelement inayotafutwa.

Matokeo

Aina Kuelewa
Mfano Mfano wa CSSStyleDeclaration wa hatua ya CSS ya kila kiwango na ukweli.

Muungano wa mtihani wa getComputedStyle() na hatua ya style

Tafuta mtihani wa getComputedStyle() na hatua ya style ya HTMLElement: yaani yanaonyesha ukufikia hatua ya kifupi ya kiwango yoyote inayotumiwa, na, hauwezi kumtaarifu ujumbe wote wa hatua ya maelezo ya stili ya kifupi ya kiwango kwa kifupi.

Wasaidizi wa wasafiri

Wote wengi wa wasaidizi wameingia getComputedStyle()Kuna

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
Msaada 9-11 Msaada Msaada Msaada Msaada
  • Ukurasa wa kuzungumza
  • Ukurasa wa mpito
  • Rudi kufikia ukurasa wa juu Window 对象