Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]

Groups > comp.lang.javascript > #11554 > unrolled thread

getComputedStyle vs currentStyle with IE 9

Back to article view | Back to comp.lang.javascript

Contents

  getComputedStyle vs currentStyle with IE 9 Andrew Poulos <ap_prog@hotmail.com> - 2012-02-10 23:02 +1100
    Re: getComputedStyle vs currentStyle with IE 9 Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2012-02-10 13:38 +0100
      Re: getComputedStyle vs currentStyle with IE 9 Andrew Poulos <ap_prog@hotmail.com> - 2012-02-10 23:48 +1100
        Re: getComputedStyle vs currentStyle with IE 9 Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2012-02-10 13:55 +0100
          Re: getComputedStyle vs currentStyle with IE 9 Andrew Poulos <ap_prog@hotmail.com> - 2012-02-11 06:48 +1100
            Re: getComputedStyle vs currentStyle with IE 9 Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2012-02-10 23:46 +0100
              Re: getComputedStyle vs currentStyle with IE 9 Tim Streater <timstreater@greenbee.net> - 2012-02-10 22:51 +0000
                Re: getComputedStyle vs currentStyle with IE 9 Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2012-02-11 11:55 +0100
              Re: getComputedStyle vs currentStyle with IE 9 Andrew Poulos <ap_prog@hotmail.com> - 2012-02-11 23:13 +1100
                Re: getComputedStyle vs currentStyle with IE 9 Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2012-02-11 14:41 +0100
                  Re: getComputedStyle vs currentStyle with IE 9 Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2012-02-11 15:21 +0100
                    Re: getComputedStyle vs currentStyle with IE 9 Andrew Poulos <ap_prog@hotmail.com> - 2012-02-12 19:04 +1100
                      Re: getComputedStyle vs currentStyle with IE 9 Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2012-02-12 10:59 +0100
    Re: getComputedStyle vs currentStyle with IE 9 Captain Paralytic <paul_lautman@yahoo.com> - 2012-02-10 05:37 -0800

#11554 — getComputedStyle vs currentStyle with IE 9

I have a function like this to get the style of an element

function getElStyle(el, IEcssPropName, cssPropName) {
   if (window.getComputedStyle) {
     return document.defaultView.getComputedStyle(el, 
null).getPropertyValue(cssPropName);

   } else if (el.currentStyle) {
     return el.currentStyle[IEcssPropName];
   }

   return null;
}

To get, say, the background colour of an element I call

getElStyle(elem, "background-color", "backgroundColor");

Alas, IE 9 supports window.getComputedStyle but not camel-cased CSS 
property names. So I tried this

function getElStyle(el, IEcssPropName, cssPropName) {
   if (window.getComputedStyle) {
     return document.defaultView.getComputedStyle(el, 
null).getPropertyValue(cssPropName) ||
            document.defaultView.getComputedStyle(el, 
null).getPropertyValue(IEcssPropName);

   } else if (el.currentStyle) {
     return el.currentStyle[IEcssPropName];
   }

   return null;
}

and it seems to work. Is there a better way?

Andrew Poulos

[toc] | [next] | [standalone]

#11558

Andrew Poulos wrote:

> Alas, IE 9 supports window.getComputedStyle but not camel-cased CSS
> property names. So I tried this
> 
> function getElStyle(el, IEcssPropName, cssPropName) {
>    if (window.getComputedStyle) {
>      return document.defaultView.getComputedStyle(el,
> null).getPropertyValue(cssPropName) ||
>             document.defaultView.getComputedStyle(el,
> null).getPropertyValue(IEcssPropName);
> 
>    } else if (el.currentStyle) {
>      return el.currentStyle[IEcssPropName];
>    }
> 
>    return null;
> }
> 
> and it seems to work. Is there a better way?

Yes.


PointedEars
-- 
Anyone who slaps a 'this page is best viewed with Browser X' label on
a Web page appears to be yearning for the bad old days, before the Web,
when you had very little chance of reading a document written on another
computer, another word processor, or another network. -- Tim Berners-Lee

[toc] | [prev] | [next] | [standalone]

#11559

On 10/02/2012 11:38 PM, Thomas 'PointedEars' Lahn wrote:
> Andrew Poulos wrote:
>
>> Alas, IE 9 supports window.getComputedStyle but not camel-cased CSS
>> property names. So I tried this
>>
>> function getElStyle(el, IEcssPropName, cssPropName) {
>>     if (window.getComputedStyle) {
>>       return document.defaultView.getComputedStyle(el,
>> null).getPropertyValue(cssPropName) ||
>>              document.defaultView.getComputedStyle(el,
>> null).getPropertyValue(IEcssPropName);
>>
>>     } else if (el.currentStyle) {
>>       return el.currentStyle[IEcssPropName];
>>     }
>>
>>     return null;
>> }
>>
>> and it seems to work. Is there a better way?
>
> Yes.

Good, could you tell what it is?

Andrew Poulos

[toc] | [prev] | [next] | [standalone]

#11560

Andrew Poulos wrote:

> On 10/02/2012 11:38 PM, Thomas 'PointedEars' Lahn wrote:
>> Andrew Poulos wrote:
>>> Alas, IE 9 supports window.getComputedStyle but not camel-cased CSS
>>> property names. So I tried this
>>>
>>> function getElStyle(el, IEcssPropName, cssPropName) {
>>>     if (window.getComputedStyle) {
>>>       return document.defaultView.getComputedStyle(el,
>>> null).getPropertyValue(cssPropName) ||
>>>              document.defaultView.getComputedStyle(el,
>>> null).getPropertyValue(IEcssPropName);
>>>
>>>     } else if (el.currentStyle) {
>>>       return el.currentStyle[IEcssPropName];
>>>     }
>>>
>>>     return null;
>>> }
>>>
>>> and it seems to work. Is there a better way?
>> Yes.
> 
> Good, could you tell what it is?

Yes.

(This would actually be funny for me if it was not so disappointing.)


PointedEars
-- 
Prototype.js was written by people who don't know javascript for people
who don't know javascript. People who don't know javascript are not
the best source of advice on designing systems that use javascript.
  -- Richard Cornford, cljs, <f806at$ail$1$8300dec7@news.demon.co.uk>

[toc] | [prev] | [next] | [standalone]

#11569

On 10/02/2012 11:55 PM, Thomas 'PointedEars' Lahn wrote:
> Andrew Poulos wrote:
>
>> On 10/02/2012 11:38 PM, Thomas 'PointedEars' Lahn wrote:
>>> Andrew Poulos wrote:
>>>> Alas, IE 9 supports window.getComputedStyle but not camel-cased CSS
>>>> property names. So I tried this
>>>>
>>>> function getElStyle(el, IEcssPropName, cssPropName) {
>>>>      if (window.getComputedStyle) {
>>>>        return document.defaultView.getComputedStyle(el,
>>>> null).getPropertyValue(cssPropName) ||
>>>>               document.defaultView.getComputedStyle(el,
>>>> null).getPropertyValue(IEcssPropName);
>>>>
>>>>      } else if (el.currentStyle) {
>>>>        return el.currentStyle[IEcssPropName];
>>>>      }
>>>>
>>>>      return null;
>>>> }
>>>>
>>>> and it seems to work. Is there a better way?
>>> Yes.
>>
>> Good, could you tell what it is?
>
> Yes.
>
> (This would actually be funny for me if it was not so disappointing.)

Its disappointing to me as well.

Andrew Poulos

[toc] | [prev] | [next] | [standalone]

#11570

Andrew Poulos wrote:

> On 10/02/2012 11:55 PM, Thomas 'PointedEars' Lahn wrote:
>> Andrew Poulos wrote:
>>> On 10/02/2012 11:38 PM, Thomas 'PointedEars' Lahn wrote:
>>>> Andrew Poulos wrote:
>>>>> Alas, IE 9 supports window.getComputedStyle but not camel-cased CSS
>>>>> property names. So I tried this
>>>>>
>>>>> function getElStyle(el, IEcssPropName, cssPropName) {
>>>>>      if (window.getComputedStyle) {
>>>>>        return document.defaultView.getComputedStyle(el,
>>>>> null).getPropertyValue(cssPropName) ||
>>>>>               document.defaultView.getComputedStyle(el,
>>>>> null).getPropertyValue(IEcssPropName);
>>>>>
>>>>>      } else if (el.currentStyle) {
>>>>>        return el.currentStyle[IEcssPropName];
>>>>>      }
>>>>>
>>>>>      return null;
>>>>> }
>>>>>
>>>>> and it seems to work. Is there a better way?
>>>> Yes.
>>> Good, could you tell what it is?
>> Yes.
>>
>> (This would actually be funny for me if it was not so disappointing.)
> 
> Its disappointing to me as well.

All you need to do is asking a *smart* question.


PointedEars
-- 
var bugRiddenCrashPronePieceOfJunk = (
    navigator.userAgent.indexOf('MSIE 5') != -1
    && navigator.userAgent.indexOf('Mac') != -1
)  // Plone, register_function.js:16

[toc] | [prev] | [next] | [standalone]

#11571

In article <1953157.aqSPkdTlGX@PointedEars.de>,
 Thomas 'PointedEars' Lahn <PointedEars@web.de> wrote:

> Andrew Poulos wrote:
> 
> > On 10/02/2012 11:55 PM, Thomas 'PointedEars' Lahn wrote:
> >> Andrew Poulos wrote:
> >>> On 10/02/2012 11:38 PM, Thomas 'PointedEars' Lahn wrote:
> >>>> Andrew Poulos wrote:
> >>>>> Alas, IE 9 supports window.getComputedStyle but not camel-cased CSS
> >>>>> property names. So I tried this
> >>>>>
> >>>>> function getElStyle(el, IEcssPropName, cssPropName) {
> >>>>>      if (window.getComputedStyle) {
> >>>>>        return document.defaultView.getComputedStyle(el,
> >>>>> null).getPropertyValue(cssPropName) ||
> >>>>>               document.defaultView.getComputedStyle(el,
> >>>>> null).getPropertyValue(IEcssPropName);
> >>>>>
> >>>>>      } else if (el.currentStyle) {
> >>>>>        return el.currentStyle[IEcssPropName];
> >>>>>      }
> >>>>>
> >>>>>      return null;
> >>>>> }
> >>>>>
> >>>>> and it seems to work. Is there a better way?
> >>>> Yes.
> >>> Good, could you tell what it is?
> >> Yes.
> >>
> >> (This would actually be funny for me if it was not so disappointing.)
> > 
> > Its disappointing to me as well.
> 
> All you need to do is asking a *smart* question.

My advice, Andrew, is to tell him to fuck off. I have and have never 
regretted it.

-- 
Tim

"That excessive bail ought not to be required, nor excessive fines imposed,
nor cruel and unusual punishments inflicted"  --  Bill of Rights 1689

[toc] | [prev] | [next] | [standalone]

#11573

Tim Streater wrote:

> Thomas 'PointedEars' Lahn <PointedEars@web.de> wrote:
>> Andrew Poulos wrote:
>> > On 10/02/2012 11:55 PM, Thomas 'PointedEars' Lahn wrote:
>> >> Andrew Poulos wrote:
>> >>> On 10/02/2012 11:38 PM, Thomas 'PointedEars' Lahn wrote:
>> >>>> Andrew Poulos wrote:
>> >>>>> […] it seems to work. Is there a better way?
>> >>>> Yes.
>> >>> Good, could you tell what it is?
>> >> Yes.
>> >> (This would actually be funny for me if it was not so disappointing.)
>> > Its disappointing to me as well.
>> All you need to do is asking a *smart* question.
> 
> My advice, Andrew, is to tell him to fuck off. I have and have never
> regretted it.

You cannot miss what you never had in the first place.


PointedEars
-- 
var bugRiddenCrashPronePieceOfJunk = (
    navigator.userAgent.indexOf('MSIE 5') != -1
    && navigator.userAgent.indexOf('Mac') != -1
)  // Plone, register_function.js:16

[toc] | [prev] | [next] | [standalone]

#11575

On 11/02/2012 9:46 AM, Thomas 'PointedEars' Lahn wrote:
> Andrew Poulos wrote:
>
>> On 10/02/2012 11:55 PM, Thomas 'PointedEars' Lahn wrote:
>>> Andrew Poulos wrote:
>>>> On 10/02/2012 11:38 PM, Thomas 'PointedEars' Lahn wrote:
>>>>> Andrew Poulos wrote:
>>>>>> Alas, IE 9 supports window.getComputedStyle but not camel-cased CSS
>>>>>> property names. So I tried this
>>>>>>
>>>>>> function getElStyle(el, IEcssPropName, cssPropName) {
>>>>>>       if (window.getComputedStyle) {
>>>>>>         return document.defaultView.getComputedStyle(el,
>>>>>> null).getPropertyValue(cssPropName) ||
>>>>>>                document.defaultView.getComputedStyle(el,
>>>>>> null).getPropertyValue(IEcssPropName);
>>>>>>
>>>>>>       } else if (el.currentStyle) {
>>>>>>         return el.currentStyle[IEcssPropName];
>>>>>>       }
>>>>>>
>>>>>>       return null;
>>>>>> }
>>>>>>
>>>>>> and it seems to work. Is there a better way?
>>>>> Yes.
>>>> Good, could you tell what it is?
>>> Yes.
>>>
>>> (This would actually be funny for me if it was not so disappointing.)
>>
>> Its disappointing to me as well.
>
> All you need to do is asking a *smart* question.

I think you are misleading me as it doesn't look like there's a better way.

One option I found is to put the currentStyle test first but that 
doesn't really resolve the fact getComputedStyle will fail with IE 9 and 
camel-cased CSS properties.

DM's recent tip only uses getComputedStyle and specifically excludes non 
camel-cased CSS properties so his function will fail in every flavour of IE.

Andrew Poulos

[toc] | [prev] | [next] | [standalone]

#11576

Andrew Poulos wrote:

> On 11/02/2012 9:46 AM, Thomas 'PointedEars' Lahn wrote:
>> Andrew Poulos wrote:
>>> On 10/02/2012 11:55 PM, Thomas 'PointedEars' Lahn wrote:
>>>> Andrew Poulos wrote:
>>>>> On 10/02/2012 11:38 PM, Thomas 'PointedEars' Lahn wrote:
>>>>>> Andrew Poulos wrote:
>>>>>>> Alas, IE 9 supports window.getComputedStyle but not camel-cased CSS
>>>>>>> property names. So I tried this
>>>>>>>
>>>>>>> function getElStyle(el, IEcssPropName, cssPropName) {
>>>>>>>       if (window.getComputedStyle) {
>>>>>>>         return document.defaultView.getComputedStyle(el,
>>>>>>> null).getPropertyValue(cssPropName) ||
>>>>>>>                document.defaultView.getComputedStyle(el,
>>>>>>> null).getPropertyValue(IEcssPropName);
>>>>>>>
>>>>>>>       } else if (el.currentStyle) {
>>>>>>>         return el.currentStyle[IEcssPropName];
>>>>>>>       }
>>>>>>>
>>>>>>>       return null;
>>>>>>> }
>>>>>>>
>>>>>>> and it seems to work. Is there a better way?
>>>>>> Yes.
>>>>> Good, could you tell what it is?
>>>> Yes.
>>>> (This would actually be funny for me if it was not so disappointing.)
>>> Its disappointing to me as well.
>> All you need to do is asking a *smart* question.
> 
> I think you are misleading me as it doesn't look like there's a better
> way.

Wrong on both accounts.  For crying out loud, a *closely related* question 
has been asked (presumably, *again*) on StackOverflow *yesterday*, and I 
have commented on the other answers there, eventually referring to 
JSX:css.js (which does not consider getPropertyValue() yet – as the 
shorthand is optional, and potentially less efficient thanks to camel-casing 
–, but soon):

<http://stackoverflow.com/questions/9216951/getting-value-of-a-css-
element/9216996>

Information about this subject can be *easily* found with Google, for 
example:

<http://lmgtfy.com/?q=currentStyle+getComputedStyle+IE>¹

(Feel stupid now?  Because you should.)
 
> One option I found is to put the currentStyle test first

It is wrong to put the `currentStyle' test and branch first.  Proprietary 
approaches should only be the fallback or alternative to standards-compliant 
ones.  Not only because the former are more error-prone, but also because 
they can be removed easier once they are not needed anymore.

> but that doesn't really resolve the fact getComputedStyle will fail with
> IE 9 and camel-cased CSS properties.

Wrong (just tested again).  getComputedStyle() "fails" with IE 
9(.0.8112.16421 on Windows 7) in *Compatibility* Mode, but not in Standards 
Mode, and it "fails" in IE < 9, of course.

<http://ie.microsoft.com/testdrive/HTML5/getComputedStyle/>

(That URL is from the first page of Google hits.  "HTML5" is M$'s marketing 
department talking, though; this method is part of W3C DOM Level 2 *Style*, 
and HTML5 refers to DOM Level 3 *Events* only.

Related URLs:

<http://en.wikipedia.org/wiki/Internet_Explorer_9#DOM>
<http://msdn.microsoft.com/en-us/library/cc288325(VS.85).aspx>)

*A little bit* of browsing through the MSDN Library (using the tree view on 
the left-hand side in Classic View) shows:

<http://msdn.microsoft.com/en-us/library/ff975168(VS.85).aspx>


PointedEars
___________
¹ <http://www.google.com/search?q=currentStyle+getComputedStyle+IE&filter=0>
-- 
When all you know is jQuery, every problem looks $(olvable).

[toc] | [prev] | [next] | [standalone]

#11592

Thomas 'PointedEars' Lahn wrote:

> Andrew Poulos wrote:
>> I think you are misleading me as it doesn't look like there's a better
>> way.
> 
> Wrong on both accounts.  For crying out loud, a *closely related* question
> has been asked (presumably, *again*) on StackOverflow *yesterday*, and I
> have commented on the other answers there, eventually referring to
> JSX:css.js (which does not consider getPropertyValue() yet – as the
> shorthand is optional, and potentially less efficient thanks to
> camel-casing –, but soon):
> […] 
>> but that doesn't really resolve the fact getComputedStyle will fail with
>> IE 9 and camel-cased CSS properties.
> 
> Wrong (just tested again).  getComputedStyle() "fails" with IE
> 9(.0.8112.16421 on Windows 7) in *Compatibility* Mode, but not in
> Standards Mode, and it "fails" in IE < 9, of course.

Well, *partially* wrong.  getComputedStyle() does not fail with IE 9 per se.  
But it does fail even in Standards Mode with camel-cased CSS properties 
because getPropertyValue() expects the *real* CSS property name.  It is 
specified so in the W3C DOM Level 2 Style Specification:

<http://www.w3.org/TR/DOM-Level-2-Style/css.html#CSS-CSSStyleDeclaration>

You MUST *only* camel-case the property name (e. g., "marginTop" instead of 
"margin-top") when you are accessing style object properties:

<http://www.w3.org/TR/DOM-Level-2-Style/css.html#CSS-CSS2Properties>

Hence my assumption that the use of getPropertyValue() might turn out to be 
more efficient than using the optional shorthand with the camel-cased 
property name, especially as you need to map "float" to "cssFloat" or 
"styleFloat" aso.


PointedEars
-- 
> If you get a bunch of authors […] that state the same "best practices"
> in any programming language, then you can bet who is wrong or right...
Not with javascript. Nonsense propagates like wildfire in this field.
  -- Richard Cornford, comp.lang.javascript, 2011-11-14

[toc] | [prev] | [next] | [standalone]

#11717

On 12/02/2012 1:21 AM, Thomas 'PointedEars' Lahn wrote:
> Thomas 'PointedEars' Lahn wrote:
>
>> Andrew Poulos wrote:
>>> I think you are misleading me as it doesn't look like there's a better
>>> way.
>>
>> Wrong on both accounts.  For crying out loud, a *closely related* question
>> has been asked (presumably, *again*) on StackOverflow *yesterday*, and I

So, I don't normally read StackOverflow.

>> have commented on the other answers there, eventually referring to
>> JSX:css.js (which does not consider getPropertyValue() yet – as the
>> shorthand is optional, and potentially less efficient thanks to
>> camel-casing –, but soon):
>> […]
>>> but that doesn't really resolve the fact getComputedStyle will fail with
>>> IE 9 and camel-cased CSS properties.
>>
>> Wrong (just tested again).  getComputedStyle() "fails" with IE
>> 9(.0.8112.16421 on Windows 7) in *Compatibility* Mode, but not in
>> Standards Mode, and it "fails" in IE<  9, of course.
>
> Well, *partially* wrong.  getComputedStyle() does not fail with IE 9 per se.
> But it does fail even in Standards Mode with camel-cased CSS properties
> because getPropertyValue() expects the *real* CSS property name.  It is
> specified so in the W3C DOM Level 2 Style Specification:
>
> <http://www.w3.org/TR/DOM-Level-2-Style/css.html#CSS-CSSStyleDeclaration>
>
> You MUST *only* camel-case the property name (e. g., "marginTop" instead of
> "margin-top") when you are accessing style object properties:
>
> <http://www.w3.org/TR/DOM-Level-2-Style/css.html#CSS-CSS2Properties>
>
> Hence my assumption that the use of getPropertyValue() might turn out to be
> more efficient than using the optional shorthand with the camel-cased
> property name, especially as you need to map "float" to "cssFloat" or
> "styleFloat" also.

I tested the following

1.
document.defaultView.getComputedStyle(el, 
null).getPropertyValue("background-color")

2.
document.defaultView.getComputedStyle(el, null)["backgroundColor"]

3. document.defaultView.getComputedStyle(el, 
null).getPropertyValue("backgroundColor")

4.
document.defaultView.getComputedStyle(el, null)["background-color"]

5.
el.currentStyle["background-color"]

6.
el.currentStyle["backgroundColor"]

where 'el' is a DIV with a bg colour set and this is what I got:

IE 9
----
1. correct colour
2. correct colour
3. ""
4. correct colour
5. correct colour
6. correct colour

Opera 11.61
-----------
1. correct colour
2. correct colour
3. ""
4. undefined
5. undefined
6. correct colour

Safari 5.1.2
------------
1. correct colour
2. correct colour
3. null
4. correct colour
5. error
6. error

Firefox 10.0.1
--------------
1. correct colour
2. correct colour
3. ""
4. undefined
5. error
6. error

Chrome 17.0.963.46
------------------
1. correct colour
2. correct colour
3. null
4. correct colour
5. error
6. error

1 and 2 appear to be the most consistent. Thanks for the time you spent 
helping me on this.

Andrew Poulos

[toc] | [prev] | [next] | [standalone]

#11720

Andrew Poulos wrote:

> On 12/02/2012 1:21 AM, Thomas 'PointedEars' Lahn wrote:
>> Thomas 'PointedEars' Lahn wrote:
>>> Andrew Poulos wrote:
>>>> I think you are misleading me as it doesn't look like there's a better
>>>> way.
>>> Wrong on both accounts.  For crying out loud, a *closely related*
>>> question has been asked (presumably, *again*) on StackOverflow
>>> *yesterday*, and I
> 
> So, I don't normally read StackOverflow.

OMG.  Google is your friend!
 
> 1.
> document.defaultView.getComputedStyle(el,
> null).getPropertyValue("background-color")

Standards-compliant.

> 2.
> document.defaultView.getComputedStyle(el, null)["backgroundColor"]

Standards-compliant (but optional).

> 3. document.defaultView.getComputedStyle(el,
> null).getPropertyValue("backgroundColor")

Not standards-compliant, not supposed to work.

> 4.
> document.defaultView.getComputedStyle(el, null)["background-color"]

Not standards-compliant, not supposed to work.

> 5.
> el.currentStyle["background-color"]

MSHTML-proprietary, but not supposed to work this way.
 
> 6.
> el.currentStyle["backgroundColor"]

MSHTML-proprietary; supposed to work *there*.

> where 'el' is a DIV with a bg colour set and this is what I got:
> 
> IE 9
> ----
> 1. correct colour
> 2. correct colour
> 3. ""

All as expected.

> 4. correct colour
> 5. correct colour

Both unexpected, but then again I never waste time testing *wrong* 
approaches.

> 6. correct colour

As expected.

> Opera 11.61
> -----------
> 1. correct colour
> 2. correct colour
> 3. ""
> 4. undefined
> 5. undefined
> 6. correct colour

All as expected.  Opera has a long history of emulating MSHTML while trying 
to be standards-compliant at the same time.

> Safari 5.1.2
> ------------
> 1. correct colour
> 2. correct colour
> 3. null
> 4. correct colour

All as expected.

> 5. error
> 6. error

Of course it gives an error in WebCore.  It's MSHTML-proprietary, for 
goodness' sake!

> Firefox 10.0.1
> --------------
> 1. correct colour
> 2. correct colour
> 3. ""
> 4. undefined

All as expected.

> 5. error
> 6. error

See above.  However, you have neglected to test potential differences 
between Standards Compliance and Quirks Mode in all cases.  It is possible 
that `currentStyle' is available in Gecko's Quirks Mode as is 
`document.all'.

> Chrome 17.0.963.46
> ------------------
> 1. correct colour
> 2. correct colour
> 3. null
> 4. correct colour
> 5. error
> 6. error

Chrome's/Chromium's layout engine is (based on) WebCore.  See above.
 
> 1 and 2 appear to be the most consistent.

Few surprises (t)here.

> Thanks for the time you spent helping me on this.

Hm, hm.


PointedEars
-- 
    realism:    HTML 4.01 Strict
    evangelism: XHTML 1.0 Strict
    madness:    XHTML 1.1 as application/xhtml+xml
                                                    -- Bjoern Hoehrmann

[toc] | [prev] | [next] | [standalone]

#11561

On Feb 10, 12:02 pm, Andrew Poulos <ap_p...@hotmail.com> wrote:
> I have a function like this to get the style of an element
>
> function getElStyle(el, IEcssPropName, cssPropName) {
>    if (window.getComputedStyle) {
>      return document.defaultView.getComputedStyle(el,
> null).getPropertyValue(cssPropName);
>
>    } else if (el.currentStyle) {
>      return el.currentStyle[IEcssPropName];
>    }
>
>    return null;
>
> }
>
> To get, say, the background colour of an element I call
>
> getElStyle(elem, "background-color", "backgroundColor");
>
> Alas, IE 9 supports window.getComputedStyle but not camel-cased CSS
> property names. So I tried this
>
> function getElStyle(el, IEcssPropName, cssPropName) {
>    if (window.getComputedStyle) {
>      return document.defaultView.getComputedStyle(el,
> null).getPropertyValue(cssPropName) ||
>             document.defaultView.getComputedStyle(el,
> null).getPropertyValue(IEcssPropName);
>
>    } else if (el.currentStyle) {
>      return el.currentStyle[IEcssPropName];
>    }
>
>    return null;
>
> }
>
> and it seems to work. Is there a better way?
>
> Andrew Poulos

Did you try googling:
cross browser getcomputedstyle

[toc] | [prev] | [standalone]

Back to top | Article view | comp.lang.javascript

csiph-web