DOM:element.style

z Mozilla Developer Center, polskiego centrum programistów Mozilli.

« Dokumentacja Gecko DOM

Spis treści 1 Podsumowanie 2 Przykład 3 Uwagi 4 Specyfikacja

[edytuj] Podsumowanie

Zwraca obiekt reprezentujący atrybut style elementu.

[edytuj] Przykład

var div = document.getElementById("div1");
div.style.marginTop = ".25in";

[edytuj] Uwagi

Ponieważ własność style reprezentuje atrybut style, który ma najwyższy priorytet w kaskadzie CSS, własność ta jest użyteczny bu ustawić styl określonego elementu. Nie przyda się jednak do sprawdzania stylu elementu, ponieważ zależy ona tylko od atrybutu style, a nie od reguł stylów określonych gdziekolwiek indziej. Możesz użyć window.getComputedStyle, by sprawdzić styl elementu.

Zobacz listę własności CSS dostępnych w DOM, gdzie znajdziesz też dodatkowe uwagi o zastosowaniu własności style.

Ogólnie rzecz biorąc, lepiej jest użyć własność style zamiast elt.setAttribute('style', '...'), ponieważ użycie style nie nadpisze innych własności CSS, które mogły być wcześniej określone atrybutem style.

Styles can not be set by assigning a string to the (read only) style property, as in elt.style = "color: blue;". This is because the style attribute returns a CSSStyleDeclaration object. Instead, you can set style properties like this:

elt.style.color = "blue";  // Directly

var st = elt.style;
st.color = "blue";  // Indirectly

The following code displays the names of all the style properties, the values set explicitly for element elt and the inherited 'computed' values:

var elt = document.getElementById("elementIdHere");
var out = "";
var st = elt.style;
var cs = window.getComputedStyle(z, null);
for (x in st)
  out += "  " + x + " = '" + st[x] + "' > '" + cs[x] + "'\n";

[edytuj] Specyfikacja

DOM Level 2 Style: ElementCSSInlineStyle.style