Browser’s implied globals
Like it's not bad enough that JavaScript has implied globals (forget var and you create a global), but the browsers have decided it's a good idea to add more pollution to the global namespace.
This has been a source of frustration before with IE, it's really hard to understand the logic behind it, but it's also happening in other browsers.
Consider this:
<meta name="description" content="test me" />
A normal META tag, right? But in IE this will create in a global variable called "description" pointing to that DOM node. Yep.
alert(description.content); // "test me"
That's pretty annoying. Even more annoying is that getElementById('description') will also point to the DOM node, although it doesn't even have an ID.
A test is born
Anyway, I wanted to test the effect of other name and id attributes in different tags and different browsers. With the exception of Firefox which doesn't create any globals, all other did to some degree. Rather disappointing. I tested IE6, 8 (plus compat view), FF 3.5, Safari 4 and Opera 10.
And below are the results. The yellow x means that testing for the presence of this global returned "undefined", the white o means that the global variable points to an object. So for example continuing with the meta example above, typeof window.description will return undefined in FF (yellow x) and object in IE (white o).
| global | description | IE | FF | Saf | O |
|---|---|---|---|---|---|
| description | <meta name="description"... | o | x | x | o |
| robots | <meta name="robots"... | o | x | x | o |
| paragraph-id | <p id="paragraph-id"... | o | x | o | o |
| paragraph-name | <p name="paragraph-name"... | x | x | x | o |
| form-name | <form name="form-name"... | o | x | o | o |
| form-id | <form id="form-id"... | o | x | o | o |
| input-name | <input name="input-name"... | x | x | x | x |
| input-id | <input id="input-id"... | x | x | o | x |
| link-name | <a name="link-name"... | o | x | x | o |
| link-id | <a id="link-id"... | o | x | o | o |
| div-name | <div name="div-name"... | x | x | x | o |
| div-id | <div id="div-id"... | o | x | o | o |
So...?
So this is a useless feature if you ask me. Not reliable, not cross-browser, maybe considered convenient back when rollover buttons and animated gifs were all the rage (and animated window.status, remember?), but today can only cause troubles where you least expect it. Should be removed in future browser versions.
For the time being we just have to remember to always declare and initialize our local variables because it looks like someone else might also decide to do so for us. Which can lead to errors if we assume too much.
This entry was posted on Tuesday, October 20th, 2009 and is filed under browsers, firefox, IE, JavaScript. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.
Get notification for future posts: follow me on Twitter or subscribe to my RSS feed
October 20th, 2009 at 1:16 am
Opera creates window.opera
October 20th, 2009 at 1:33 am
Hi Stoyan, for completeness, Google Chrome unsurprisingly mirrors the results from Safari…
paragraph-id: object
form-name: object
form-id: object
input-id: object
link-id: object
div-id: object
October 20th, 2009 at 2:54 am
I think the most interesting thing is: does those global variables get declared when user inserts node dynamically, from Javascript. This could lead to overwriting existing variables.
BTW, why can’t I type „dunno” in spam protection field?
October 20th, 2009 at 4:57 am
[...] Browser’s implied globals / Stoyan’s phpied.com http://www.phpied.com/browser-implied-globals – view page – cached Like it’s not bad enough that JavaScript has implied globals (forget var and you create a global), but the browsers have decided it’s a good idea to add more pollution to the global namespace. — From the page [...]
October 20th, 2009 at 7:36 am
[...] Tweets about this great post on TwittLink.com [...]
October 20th, 2009 at 7:49 am
Sure this shouldn’t be mapped as implied globals…
Could we have a “document.meta” collection instead ?
Or even “document.head.meta” ?
For the others examples (form, div, input, p, from id or name), it makes me think to forms, elements, anchors, links, and images HTMLCollections
It is also possible to call (I didn’t already tested it on all browsers) :
document.forms[form-name].elements[input-name]
This can provide some unespected results if a form or an input element has some specific name values like:
– “id”
– “length”
– “action”
– “name”
…
October 20th, 2009 at 4:17 pm
Hi Stoyan,
Try changing to and then running console.log(paragraph.tagName) in Firefox. You will get “P” (surprise!) Firefox does this in Quirks mode, but not in Standards mode.
October 20th, 2009 at 4:20 pm
Hi Stoyan,
Try changing id=”paragraph-id” to id=”paragraph” and then running console.log(paragraph.tagName) in Firefox. You will get “P” (surprise!) Firefox does this in Quirks mode, but not in Standards mode.
October 20th, 2009 at 5:08 pm
The issue with name attribute acting as an id in IE is well known for form elements, but not surprisingly it appears valid for any element. I guess the other browsers suffering from this illness just copied the behavior from IE.
October 21st, 2009 at 10:35 am
[...] Stefanov has done some testing on so called implied globals in browsers. One of the interesting finds was that the meta description is accessible in JavaScript using [...]
October 21st, 2009 at 4:43 pm
[...] Stefanov has done some testing on so called implied globals in browsers. One of the interesting finds was that the meta description is accessible in JavaScript using [...]
October 26th, 2009 at 8:19 am
[...] Stefanov has done some testing on so called implied globals in browsers. One of the interesting finds was that the meta description is accessible in JavaScript using [...]
October 28th, 2009 at 6:06 pm
[...] – Stoyan Stefanov has done some testing on so called implied globals in browsers. One of the interesting finds was that the meta description is accessible in JavaScript using [...]
November 4th, 2009 at 8:21 pm
[...] the footsteps of Firefox and supports WebGL to allow for 3D web development.Did you know that a meta description in IE becomes a global variable in JavaScript? Stoyan Stefanov has done some testing.Cameramouse is an interesting tool that allows you to [...]
November 14th, 2009 at 5:51 am
[...] Stefanov has done some testing on so called implied globals in browsers. One of the interesting finds was that the meta description is accessible in JavaScript using [...]
February 27th, 2010 at 4:48 pm
good work
however, removing this will never happen. the argument will be “it will break the web”
But it is a good example of the mess we are in
December 16th, 2010 at 12:39 pm
Internet explorer must die, its a plague sent to kill netscape but it also poisoned internet!
April 27th, 2013 at 2:42 pm
Jiangdong starting shook his head, sighed heavily, is not to find Zhao, and sat down once again. The eyes of a number of dark, some lost, some restless. Zhao Xin see tory burch flats appear so sad, the hearts of tenderness at this point and said: Well, tory burch outlet to discuss upstairs. From Jiangdong not discussing, the two one after the previous one went downstairs and one upstairs. Jiangdong from the conclusion with Zhao came to her and also the common Suhongtu bedroom.