Run results for: Get element by class

Run details:

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/53.0.2785.101 Safari/537.36

Browser: Chrome 53

Operating system: Mac OS X 10.11.6

Device Platform: Other

Date tested: 8 years ago

Test name	Executions per second
vanilla js	1664418.4 Ops/sec
jquery	224808.4 Ops/sec
custom	98903.3 Ops/sec

HTML Preparation code:

<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.1.0.min.js"></script>
<div class="myDiv"></div>

Script Preparation code:

function getElement(selector, single, pos) {
    var el;

    // return single node
    // only runs if [single] is undefined
    if(single == undefined) el = document.getElementById(selector) || document.querySelector(selector);

    if(el == null) {
        if(single == false) {
            // return nodelist
            el = document.getElementsByClassName(selector);
            if(el.length == 0) el = document.getElementsByTagName(selector);
            if(el.length == 0) el = document.querySelectorAll(selector);
            if(el.length == 0) el = getElementsByClassName(selector);
        } else {
            // return single node from nodelist
            pos = (pos == null) ? 0 : pos;       // if arrayPos null, default to 0

            el = document.getElementsByClassName(selector)[pos] ||
                 document.getElementsByTagName(selector)[pos]   ||
                 document.querySelectorAll(selector)[pos]       ||
                 getElementsByClassName(selector)[pos];
        }
    }

    return el;
}

Tests:

vanilla js
var el = document.getElementsByClassName('myDiv')[0]; var classname = el.className;
jquery
var el = $('.myDiv')[0]; var classname = el.className;
custom
var el = getElement('myDiv'); var classname = el.className;

Run results for: Get element by class

vanilla js

jquery

custom