window object acting strange in Chrome and IE
Consider the following开发者_如何学运维 sample HTML:
<div id="about">
<!-- content here -->
</div>
And the following script
var about = (function ($, window, document) {
"use strict";
var methods;
methods = {
init: function () {
// Do things here
}
};
return methods;
} (jQuery, window, document));
The variable about
should be attached to the window
object at this point.
In Firefox (3.6.17) I am able to write
window["about"]
And if about hasn't been processed yet this will return undefined
if it has it will return the object just as I expect.
However, the problem is that that same code window["about"]
in Chrome and IE (7 & 8) returns the actual HTML object. From the example above, it would return the following:
<div id="about">
<!-- content here -->
</div>
Why does this happen?
Also, is there a better way to check and see if the about
object is available, than using the window
element? I realize ideally one doesn't want to junk up the window object but that is a different question all together.
Thanks
The WebKit browsers seem to ape the old IE behavior of treating element "id" values as properties of the window
object.
I dislike the behavior, personally.
Chrome will take any ID in the HTML and turn it into a global variable. You can overwrite the assignment, but I assume you're checking for existence and not overwriting perhaps?
http://jsfiddle.net/robert/Hnw7y/
One way to differentiate between the HTMLElement
and the function would be to check the object's type:
if (typeof window.about === 'function') {
// the 'about' function has been defined
}
Unfortunately the only way you can do this is the following:
function global(name) { return eval(name); }
if( global("about") )
...
Try this: http://jsfiddle.net/PMqPv/1/
精彩评论