Is it possible to find CSS rules from an HTML node via JavaScript?

Question

I want to get an element in the DOM and then lookup what rules in my CSS file(s) are contributing to it\'s appearance. Similar to what firebug or webkits inspector does. Is

Answer 1

This is what you want. WebKit only. I found out about getMatchedCSSRules by looking at the chromium web inspector source.

  function getAppliedSelectors(node) {
    var selectors = [];
    var rules = node.ownerDocument.defaultView.getMatchedCSSRules(node, '');

    var i = rules.length;
    while (i--) {
      selectors.push(rules[i].selectorText);
    }
    return selectors;
  }