The computed style of an element incorporates external CSS (via stylesheets), inline styles and styles prescribed via JavaScript. It's most commonly used to get the default style of an element if it's not specifically assigned via styles, i.e. the default style that the browser gives an element. It's a very undocumented part of JavaScript engines, and, of course, there are multiple implementations. For more details, read this blog post.

For my Linkurious project, I needed to get the computed style of an element in a cross browser way. I came up with an implementation that works in every version of every browser (within reason, the C64 is not supported), and is easy to use.

I'll leave the details of how it works as an exercise to the reader. I will say that this is a good example of how to use a closure to improve the efficiency of a function. Notice that the cross-browser garbage is only executed once, not on each call.

//must be executed on or after the domready event, since it (may) require document.body to be non-null
var getComputedStyle = function() {
  var func = null;
  if (document.defaultView && document.defaultView.getComputedStyle) {
    func = document.defaultView.getComputedStyle;
  } else if (typeof(document.body.currentStyle) !== "undefined") {
    func = function(element, anything) {
      return element["currentStyle"];

  return function(element, style) {
    return func(element, null)[style];

//and use like so:
getComputedStyle(document.getElementById("foo"), "display"); //might return "inline-block"