querySelector vs getElementById (v2)

Revision 2 of this benchmark created by life on


Preparation HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<div style="display: inline-block;" id="posterTitle_0" class="posterTitle focus">Sevdaluk</div><div id="posterTitle_1" class="posterTitle">Aşk Ekmek Hayaller</div><div id="posterTitle_2" class="posterTitle">Firuze</div><div id="posterTitle_3" class="posterTitle">Altındağlı</div><div id="posterTitle_4" class="posterTitle">Adını Kalbime Yazdım</div><div id="posterTitle_5" class="posterTitle">Bir Milyon Kimin</div><div id="posterTitle_6" class="posterTitle">Makina Kafa</div>

Test runner

Ready to run.

Testing in
TestOps/sec
getElementById
var focusedImg = $('div.posterTitle.focus');
$(focusedImg).removeClass("focus");
$(focusedImg).next().addClass("focus");
ready
querySelector
var focusedImgTitle = document.getElementsByClassName("posterTitle focus")[0];
$(focusedImgTitle).removeClass("focus");
$(focusedImgTitle).next().addClass("focus");
ready

Revisions

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

  • Revision 2: published by life on