container.getElementsByTagName is not a function

I was setting up DokuWiki the other day to play around with. I want to use it as a kind of note pad of sorts to document some of my work and ideas and keep them accessible. As I was tweaking things here and there things started to get a little broken. In particular, the cool editing toolbar over the edit box when editing topics disappeared. Looking at the DokuWiki faq it seems the most likely cause is broken JavaScript somewhere so I opened up FireBug to see what was happening. This is what I found:

container.getElementsByTagName is not a function
   var collection = container.getElementsByTagName(tagName);

Well, that looks like a valid function for a DOM element so why would it not be defined? This error is occurring on line 2155 of ASCIIMathML.js (2.0.2) in the function called getElementsByClass(). This function takes three parameters, container, tagName, and clsName. So I set a break point and check some of the parameters. Right away I see that the container parameter is actually being given a string that actually looks like a class name. Until recently, browsers didn’t supply a native getElementsByClass() function[1] so libraries that needed it provided their own implementation. It seems this implementation is overriding another implementation that does take the class name as a first parameter instead of a DOM element.
ASCIIMathML.js actually only calls this function twice so I opted for the simple solution of find/replace in ASCIIMathML.js and renamed the function to something simple like amGetElementsByClass(). With that change, the error is gone and my toolbar is back.
[1] JavaScript now has a native getElementsByClassName() method supported by Firefox 3 and up, IE9 (not 7 or 8!) Safari, Chrome and Opera.


Related Posts

Leave a Reply