querySelectorAll vs getElementsByClassName

Benchmark created by Meph1k on October 12, 2018

Preparation HTML

<p class="paragraph-1">paragraph 1</p>
<p class="paragraph-2">paragraph 2</p>
<p class="paragraph-3">paragraph 3</p>
<p class="paragraph-4">paragraph 4</p>
<p class="paragraph-1">paragraph 1</p>
<p class="paragraph-2">paragraph 2</p>
<p class="paragraph-3">paragraph 3</p>
<p class="paragraph-4">paragraph 4</p>
<p class="paragraph-1">paragraph 1</p>
<p class="paragraph-2">paragraph 2</p>
<p class="paragraph-3">paragraph 3</p>
<p class="paragraph-4">paragraph 4</p>
<p class="paragraph-1">paragraph 1</p>
<p class="paragraph-2">paragraph 2</p>
<p class="paragraph-3">paragraph 3</p>
<p class="paragraph-4">paragraph 4</p>

Test runner

const paragraph1Elements = document.querySelectorAll('.paragraph-1');

const paragraph1Elements = document.getElementsByClassName('paragraph-1');

Revisions

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

• Revision 1: published by Meph1k on October 12, 2018