Jon Jon - 3 months ago 21
HTML Question

Is getElementById() efficient?

I often use the method

getElementById("id1");
in my methods. I use it to find certain elements in my HTML. I wonder if I need to be concerned about how much I use it if it has to search the entire DOM every time.

How does this method work? Does it parse the DOM and return the element when it is found, or does it have all those values indexed somehow and so is able to return more quickly?

P.S. I am curious about the method in general, but I am using an Android WebView if that makes any difference.

Answer

getElementById is very fast and you shouldn't have to worry about performance.

If you are using the same ID over and over (and over and over) again, you might want to cache it. The performance gain is neglectable:

var myId = getElementById("myId");
myId.operation1();
myId.operation2();
myId.andSome5000MoreCalls();

Check this SO answer for some benchmarks. The results Mike posted were:

IE8 getElementById: 0.4844 ms
IE8 id array lookup: 0.0062 ms

Chrome getElementById: 0.0039 ms
Chrome id array lookup: 0.0006 ms

Firefox 3.5 was comparable to chrome.