Benchmark: parent vs closest 555

HTML Preparation code:

<span class="span">
    <div id='it'>
    </div>
</span>

Script Preparation code:

var it = document.getElementById("it");

function closestParent(element, className) {
    if (element.classList.contains(className)) return element;
    if (!element.parentNode) return null;
    if (element.parentNode.classList.contains(className)) return element.parentElement;
    return null;
  }

Tests:

parentElement
while (it !== null && it.className.indexOf("span") === -1) { it = it.parentElement; }
closest tag
it.closest('span')
closest class
it.closest('.span')
closest tag class
it.closest('span.span')
parentNode
while (it.className.indexOf("span") === -1) { it = it.parentNode; if(it === document) { it = null break } }
closestParentNode
closestParent(it, 'span');

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
parentElement
closest tag
closest class
closest tag class
parentNode
closestParentNode

Fastest: N/A

Slowest: N/A

Latest run results:

No previous run results

This benchmark does not have any results yet. Be the first one to run it!

Related benchmarks:

parent vs closest 555 (version: 2)

Comparing performance of: parentElement vs closest tag vs closest class vs closest tag class vs parentNode vs closestParentNode

Created: 3 years ago by: Registered User

Jump to the latest result

parentElement

closest tag

closest class

closest tag class

parentNode

closestParentNode

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

No previous run results