I have a problem with old website. All JavaScript code on it use getElemenById function. But tags of site markup doen't have id property, instead they have only name property. Although it still works for IE, browser returns elements even by name property. For all other browsers it's a mistake in JS. I wonder if there any way to overload this function in other browser to make web site compatible to other browsers?
-
3It would probably be better to fix the code so it works properly rather than try and hack the method to work differently on other browsers. You can use the `getElementsByName` method to find elements by name, although this returns an array as name is not expected to be unique like ID. – Richard Dalton Jul 28 '11 at 07:40
3 Answers
There's no way to "overload" a function in JavaScript in the sense that you would do so in a strongly-typed language like Java or C. In fact, every function in JavaScript is already overloaded in this sense in that you can call any function with any number and type of arguments.
What you can do, however, is insert your own proxy in front of the existing version, and implement the proxy with whatever behavior you prefer. For instance:
document._oldGetElementById = document.getElementById;
document.getElementById = function(elemIdOrName) {
var result = document._oldGetElementById(elemIdOrName);
if (! result) {
var elems = document.getElementsByName(elemIdOrName);
if (elems && elems.length > 0) {
result = elems[0];
}
}
return result;
};

- 54,026
- 20
- 135
- 176
-
1
-
1For people coming here because they receive `Illegal target invocation`, the trick is to backup the `getElementById` function to the document object itself and then it can access it (which is exactly how this post does it). – tresf Dec 13 '18 at 19:22
I wouldn't count on overriding getElementById
working properly. Sounds easy enough to do a search and replace that does something like this:
// Replace
document.getElementById("foo");
// With
myGetElementById("foo", document);
// Replace
myElement.getElementById("foo");
// With
myGetElementById("foo", myElement);
Then you can myGetElementById
as you want, without worrying about what might happen in old IEs and what not if you override getElementById
.

- 54,010
- 13
- 102
- 111
Try getElementsByName. This is used to get a collection of elements with respect to their name

- 3,875
- 1
- 30
- 51
-
Thank you. I know that, but for this old web site is to much of work. I just nee an workaround. – Johnny_D Jul 28 '11 at 07:53