Simple getComputedStyle in Prototype JS?

Question

Is there an easy cross-browser way to get computed style of an element in PrototypeJS, without checking document.defaultView... and other properties? ...so that the code looked like

var elt = $$('.xyz')[k],
    border = elt.getComputedStyle('border-bottom-width')

PrototypeJs provides getDimensions, -Width, and -Height methods that return computed dimensions, but there's no way to get other computed styles, like borders, backgrounds, etc.

I've found several stand-alone implementations of getComputedStyle, but maybe there's a patch/plugin for PrototypeJS that does that?

Answer 1

Not that I know of.

This is probably because the "get computed style" implementations are so different that it's hardly possible to guarantee uniform results (Which renders them useless for a cross-browser framework).

For example, getting the computed font size cross-browser is not always possible, as I learned in this question.

Answer 2

Prototype's getStyle method encapsulates all the cross-browser computed style work you're looking for:

var bgColor = $(element).getStyle('background-color');

From the docs:

This method looks up the CSS property of an element whether it was applied inline or in a stylesheet. It works around browser inconsistencies regarding float, opacity, which returns a value between 0 (fully transparent) and 1 (fully opaque), position properties (left, top, right and bottom) and when getting the dimensions (width or height) of hidden elements.