HTML DOM Element style ominaisuus

Määritelmä ja käyttö

style Ominaisuus palauttaa elementin style-ominaisuuden arvon CSSStyleDeclaration-objektina.

CSSStyleDeclaration-objekti sisältää elementin kaikki sisäänrakennetut tyyliominaisuudet. Se ei sisällä <head> Minkään osan tai minkä tahansa ulkoisen tyyli表的 minkään tyyliominaisuuden.

Piste 1

Et voi asettaa tällaista tyyliä:

element.style = "color:red";

Sinun täytyy käyttää tällaista CSS-ominaisuutta:

element.style.backgroundColor = "red";

Kokeile itse

Piste 2

JavaScriptin ja CSS:n syntaksi eroaa hieman:

backgroundColor / background-color

Katso myös: Täydellinen Style-objektin ohjekirja.

Piste 3

Käytä tätä style-ominaisuutta sen sijaan setAttribute() -menetelmävälttääksesi, että muut style-ominaisuuden ominaisuudet korvattaisiin.

Katso myös:

CSS-opas

CSS-viittaus

Style-objekti

HTML <style>-tagi

Esimerkki

Esimerkki 1

Muuta "myH1" väriä:

document.getElementById("myH1").style.color = "red";

Kokeile itse

Esimerkki 2

Hanki "myP" yläreunan arvo:

let value = document.getElementById("myP").style.borderTop;

Kokeile itse

Syntaksi

Palauta style-ominaisuus:

Elementti.style.Ominaisuus

Aseta style-ominaisuus:

Elementti.style.Ominaisuus = Arvo

Ominaisuuden arvo

Arvo Kuvaus
Arvo

Määritä ominaisuuden arvo.

Esimerkiksi:

element.style.borderBottom = "2px solid red"

Palautusarvo

Tyyppi Kuvaus
Objekti elementin CSSStyleDeclaration-objekti.

Selaimen tuki

element.style Se on DOM Level 2 (2001) ominaisuus.

Kaikki selaimet tukevat sen täysin:

Chrome IE Edge Firefox Safari Ooppera
Chrome IE Edge Firefox Safari Ooppera
Tuki 9-11 Tuki Tuki Tuki Tuki