tags:

views:

17

answers:

1

Hey I was testing this code. The alert displays the result in IE but not in Firefox:

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>Get computed border width</title>
    <script type="text/javascript" src="http://o.aolcdn.com/dojo/1.3.2/dojo/dojo.xd.js" djConfig="useXDomain:true">
    </script>
    <script>
        function doOnLoad(){
            var o = dojo.byId("myDiv");
            alert(dojo.getComputedStyle(o).borderWidth);
        }
    </script>
</head>
<body onLoad="doOnLoad();">
    <div style="border-width:10px" id="myDiv">
        I am myDiv
    </div>
</body>
</html>  

What is the reason why the alert is not diplaying in FF?

+1  A: 

I'd advise you to read the API documentation of the function you're using: http://www.dojotoolkit.org/api/dojo.html#dojo.getComputedStyle (note: if the page jumps to the wrong location, focus the address bar and hit enter again. seems like an unfortunate side-effect currently in the API pages...)

As that says, using getComputedStyle directly leaves you at the mercy of the particular browser's implementation of that function. In the case of borderWidth, Gecko appears to automatically expand it to borderTopWidth and so-on, subsequently blanking out the value of borderWidth itself.

You're probably far more interested in using this instead:

dojo.style(o, 'borderWidth')

Which will return 10 in both browsers.

Ken
Thanks I will try that.
Amen
Well that worked. Here is the code: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title>Get computed border width</title> <script type="text/javascript" src="http://o.aolcdn.com/dojo/1.3.2/dojo/dojo.xd.js" djConfig="useXDomain:true"> </script> <script> function doOnLoad(){ var o = dojo.byId("myDiv"); alert(dojo.style(o, 'borderWidth'); } </script></head><body onLoad="doOnLoad();"> <div style="border-width:10px" id="myDiv"> I am myDiv </div></body></html>
Amen