getElementById VS jQuery('#id') (v177)

Revision 177 of this benchmark created on


Preparation HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">
</script>
<div id="somediv">
<p id="foo" class="bar">
  Test
</p>
<p id="foo2" class="bar">
  Test2
</p>
<p id="foo3" class="bar bars">
  Test3
</p>
<p id="foo4" class="bar">
  Test4
</p>
</div>
<script>
jQuery.fn.dom = function() {
    return this[0];
};
function GetClass (selector, context, asJquery, fromParent) {

        if (IsNotDefined(context)) {
            context = document;
        }
        else {
            context = GetDom(context);
        }
        if (fromParent) {
            context = parent.document;
        }
        if (asJquery) {
            return $(context.getElementsByClassName(selector));
        }
        else {
            return context.getElementsByClassName(selector);
        }

    };


    function IsDefined (value) {

        return typeof value !== "undefined" && value != null;

    };

    function IsNotDefined (value) {

        return !IsDefined(value);

    };



    function GetDom (object) {

        if (IsDefined(object.jquery)) {
            return object.dom();
        }
        return object;

    };
</script>

Test runner

Ready to run.

Testing in
TestOps/sec
jquery find
var test = $('#somediv').find('.bars')
ready
DOM find
var test = GetClass('bars', document.getElementById('somediv'))
ready
DOM find with jquery
var test = GetClass('bars', document.getElementById('somediv'), true)
ready

Revisions

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