I’m currently writing a webapp that is required to work on Ie as well as Firefox, nothing too amazing in that. I’m willing to bet that many developers follow the same workflow as me … develop using Firefox, then make sure it works in IE. Using tools such as theYahoo UI toolkit, Dojo or one of the many other toolkits that helps with cross browser compatability, this task is a lot less fraught than it used to be. Occaisionaly the, you get a good one …
object doesn't support this property or method
I’ve spent the best part of this morning tracking down this bug, which only occurs in IE. My origional code was this:
container = document.getElementById('container');
Which I immediatly changed to
container = YAHOO.util.Dom.get('container');
but that didn’t help much either, YAHOO.util.Dom.get
uses document.getElementByI() anyway, so it just moved the problem further up the call stack.
Anyway, to cut a long story short, and to stop you spending as much time reading this post as I did finding the problem, it turns out that IE cannot handle global variables with the same name as an DOM element ID, especially if that variable is actually pointing at that DOM node!!
As Dav Glass explained in reply to my post on the YDN Javascript list, what’s actually happening is that when parseing the page, IE automagically creates a global variable for anything it find with an ID or NAME tag.
In my code, making the variable a private member was actually the right thing to do, but if you absolutly positivly have to make that var global, just make sure it doesn’t share it’s name with the element your trying to get at.
24 Comments so far
Leave a comment
Thanks, I saw this posted on the YUI boards and will try to remember it going forward.
Comment by David Runion February 6, 2007 @ 3:03 pmStuart —
It’s not that IE can’t handle them being named the same, it’s an issue with the way that IE makes global variables. When IE parses a page, it “auto-magically” creates global vars for anything that it finds with an id/name attribute. The term I use for it is “global namespace polluting”, Mozilla does too.
Comment by Dav Glass February 6, 2007 @ 3:08 pmThanks for posting this Stuart. Saved me some time wondering what the hell IE was choking on.
Comment by Joshua Bloom March 3, 2007 @ 10:26 pmIn your code:
container = document.getElementById(‘container’);
Perhaps your variable container is a reserved/keyword.
,,,.º¿º.,,,
Comment by Joe March 7, 2007 @ 3:19 amHi,
How to handle getElementById(‘tableid ‘).add one row in a table
Comment by Muthu kumar March 7, 2007 @ 9:27 amThanks this helped a lot! Every day i grow more and more annoyed with IE. Also to add to Stuarts comment a good friend once told me “every global variable is doing you damage”…
Comment by Matt Fellows April 18, 2007 @ 6:40 amThanks for this! It’s been doing my head in for the past 20 minutes!
Comment by Michael Smith May 10, 2007 @ 10:47 am[…] Thanks, Stuart. […]
Pingback by two seven » Blog Archive » JS vs. IE; round two. July 20, 2007 @ 12:05 amOK, but what is the cure? Now that you have located the problem, what does one do about it??
Comment by David W October 30, 2007 @ 5:24 pmThanks — David
@David: As I said in the last paragraph, either change the name of the variable, or make the variable local to the function.
Comment by Stuart Grimshaw October 30, 2007 @ 5:58 pmhow to handle getElementById for tableId(“getElementById(“tableID”). need to add a row for the table.
Comment by uday July 25, 2008 @ 10:59 pmThanks… uday
Praise: Geez, it was so obvious! TY, you have saved me a lot of googling!
Comment by Adam August 16, 2008 @ 7:06 pmThanks! You saved me a lot of time. Made my variables local to the function and the problem went away. And I hate IE.
Comment by Tom September 10, 2008 @ 9:17 pm[…] a mesma coisa para o método getElementById mas agora, descobri esse outro problema, que graças ao Stubblog descobri a […]
Pingback by Erro “object doesn’t support this property or method” ao usar getElementById no IE - Blog do yogodoshi - Tecnologia, Blogosfera, web 2.0 e Humor é claro! September 17, 2008 @ 5:05 pmI’ve found that IE doesnt like if you call the variable with the same name of the ID.
Comment by Alex October 15, 2008 @ 7:43 amThank you sooooo much for this. I was about to rip my head off when I found this post.
MS are such cretins at times!
Comment by David November 12, 2008 @ 10:46 amGoodday I’m new here
Comment by wowbassitty December 18, 2008 @ 1:32 amAnd it looks like a interesting forum, so just wanted to say hello! :):):)
And looking forward to participating.
Going on vacation for a few days, so i’ll be back
THANK YOU!!!
Comment by BK December 30, 2008 @ 8:00 pmFound this on another forum. Worked for me.
————- Quoted Text —————
hit this javascript error last night testing a Firefox developed code based for bugs in IE
“object doesn’t support this property or method”
I think it was because i had this pattern going:
f_name=document.getElementById(‘f_name’);
Adding a var fixed the problem IE.
var f_name=document.getElementById(‘f_name’);
(IE, remember that app with the blue e?, I only used it for Testing & Support these days, boy is it a chore to debug javascript with IE compared to Firefox!)
Comment by DonnieT March 6, 2009 @ 3:31 pm@DonnieT : Adding the “var” keyword before the variable names makes it local/private to the method in which it’s defined, which is what I’m doing.
Comment by Stuart Grimshaw March 6, 2009 @ 4:02 pmSame problem… ;-)
Solved thanks to you
Claudio
included this reference here in the source code
Comment by Claudio Klemp October 10, 2009 @ 11:46 amDuuuuuude.
Thanks so much for this solution.
Solved my prob. too.
Amazing how IE continues being buggy…
Comment by Bruno420 March 12, 2010 @ 7:44 pmthank you for solution.
Comment by Chumpol M. September 20, 2010 @ 10:23 amalready, I can silved my problem.
Thanks for this post, yep solved my problem.
I’m never surprised at how IE continues to breaks things for stupid reasons
Comment by Thomas G November 3, 2010 @ 7:23 pm