JavaScript: The Definitive Guide, 5th Edition

Name

Window.getComputedStyle( ): retrieve the CSS styles used to render an element — DOM Level 2 CSS:

Synopsis

CSS2Properties getComputedStyle(Elementelt,
                                String pseudoElt);

Arguments

elt

The document element whose style information is desired.

pseudoElt

The CSS pseudoelement string, such as “:before” or “:first-line”, or null if there is none.

Returns

A read-only CSS2Properties object that represents the style attributes and values used to render the specified element in this window. Any length values queried from this object are always expressed as pixel or absolute values, not relative or percentage values.

Description

An element in a document may obtain style information from an inline style attribute and from any number of style sheets in the stylesheet “cascade.” Before the element can actually be displayed in a view, its style information must be extracted from the cascade, and styles specified with relative units (such as percentages or “ems”) must be “computed” to convert to absolute units.

This method returns a read-only CSS2Properties object that represents those cascaded and computed styles. The DOM specification requires that any styles representing lengths use absolute units such as inches or millimeters. In practice, pixel values are commonly returned instead, although there is no guarantee that an implementation will always do this.

Contrast getComputedStyle( ) with the style property of an HTMLElement, which gives you access only to the inline styles ...