House of Metnetsky

I came across a fun little issue today that I think should have been more obvious to me. Apparently, and I can’t believe I’m saying this: IE and Firefox parse Javascript differently. Take the following code:

var foo = [
{'one': 1},
{'two': 2},
];

What should the length be? In Firefox 2 & 3 the length is 2, but in IE7/IE8 the length is 3. I can’t confirm this, but considering I figured this out due to a *NEW* bug in one of our products, I think this is somewhat new in IE.

On a side note, it’s interesting that IE even parses the above considering the following code will break:

var foo = {
'one': 1,
'two': 2,
}

The difference here is of course that foo in the second example is an object, whereas the first example it’s an array.

Why is it that IE7 and IE8 Beta 2 still can’t quit get the <object/> tag correct? When using Javascript to “dynamically” add object tags to the interface my experience, bad luck, and bouts of pain teach me that using the DOM API just doesn’t cut it. Well, to be fair the following functions don’t cut it:

• document.createElement
• document.createAttribute
• [DOMElement].setAttribute(key, value)
• [DOMElement].setAttributeNode([DOMAttribute])

For any and all other “dynamic” HTML modifications the above functions work great! But if I use them to embed Flash or Silverlight movies it just tanks. Instead you have to construct ugly strings that represent the HTML you want and use [DOMElement].innerHTML. When you do this, suddenly the .swf/.xap loads and all is well.

Why oh why?

And for anyone who cares, following file does a decent job of HTML generation within Javascript… except for IE and the <object/> tag…. and input of type radio (WTF!).

http://cowarthill.com/blog/wp-content/uploads/2008/11/html_obj.js