Extending Element Part 2

So as I mentioned at the end of my previous entry regarding extending Element in Internet Explorer; all my "hack" really did was replace one problem with another.

Now, at the moment I'm working on a Google Maps project and as you can probably imagine (or perhaps already know) there are a lot of DOM elements created by maps. For the solution in my previous blog entry, it is absolutely crippling trying to load a map. In fact, it took well over 5 minutes to render a single map. This project is for a client and so that kind of performance simply won't do.

I had to come up with another solution. It didn't take me too long to figure something out. I remembered from my time working with the Prototype JavaScript library that the developers there had figured out a way of extending it while maintaining performance in the browser. I also recalled that it wouldn't work in Internet Explorer unless the element had been extended with their element extension function which was usually done by the dollar function.

So I decided to follow this practice while applying my own sugar to the solution. And so here is the solution:

if (!window.Element)window.enableExtendElement;
$=function(element)
{
 if (window.enableExtendElement && !element.__extended)
 {
     Object.extend(element,Element.prototype);
     element.__extended=true;
 }
 if (Object.isElement(element))return element;
 return document.getElementById(element);
}

As for the Object.extend function. Well I'm sure you can figure that one out on your own ;)