getElementById vs getElementsByClassName (v3)

Revision 3 of this benchmark created by Jordo on

Preparation HTML

<div class="div" id="div1">
</div>
<div class="div" id="div2">
</div>
<div class="div" id="div3">
</div>
<div class="div" id="div4">
</div>
<div class="div" id="div5">
</div>
<script>
  x = 1
  
  handlers = {
    1: null,
    2: null,
    3: null,
    4: null,
    5: null
  
  }
</script>

Test runner

Ready to run.

Testing in
TestOps/sec
getElementById
for (i = 1; i <= 5; i++) {
  x = document.getElementById("div" + i);
  x.onclick = function() {
    return Math.random();
  }
}
ready
getElementsByClassName
for (i = 1; i <= 5; i++) {
  handlers[i] = function() {
    return Math.random();
  }
}
ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.