IE DOM element iteration (v3)

Revision 3 of this benchmark created by Paul Grenier on May 20, 2011

Preparation HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script><div>
  <ul>
    <li><input></li>
    <li><input></li>
    <li><input></li>
  </ul>
  <ul>
    <li><input></li>
    <li><input></li>
    <li><input></li>
  </ul>
  <ul>
    <li><input></li>
    <li><input></li>
    <li><input></li>
  </ul>
  <ul>
    <li><input></li>
    <li><input></li>
    <li><input></li>
  </ul>
  <ul>
    <li><input></li>
    <li><input></li>
    <li><input></li>
  </ul>
  <ul>
    <li><input></li>
    <li><input></li>
    <li><input></li>
  </ul>
</div>
<script>
  var i, len, $$ = (function(a) {
   var doc = document;
   return function(b, ctx) {
    var e;
    if (ctx && typeof ctx === "object" && typeof b === "string") {
     a[0] = ctx;
     e = a.find("[id=" + b + "]").get(0);
    }
    if (typeof b === "string" && !e) {
     e = doc.getElementById(b);
    }
    if (typeof b === "object") {
     a[0] = e = b;
    }
    if (e === null) {
     e = doc.getElementsByName(b);
     a[0] = e[0] ? e[0] : e;
    } else {
     a[0] = e;
    }
    return a;
   };
  }(jQuery([1])));
  
  (function($) {
   // https://gist.github.com/938767
   var detach = $.detach = function(node, async, fn) {
    var parent = node.parentNode;
    var next = node.nextSibling;
    // No parent node? Abort!
    if (!parent) {
     return;
    }
    // Detach node from DOM.
    parent.removeChild(node);
    // Handle case where optional `async` argument is omitted.
    if (typeof async != 'boolean') {
     fn = async;
     async = false;
    }
    // Note that if a function wasn't passed, the node won't be re-attached!
    if (fn && async) {
     // If async == true, reattach must be called manually.
     fn.call(node, reattach);
    } else if (fn) {
     // If async != true, reattach will happen automatically.
     fn.call(node);
     reattach();
    }
    // Re-attach node to DOM.
  
    function reattach() {
     parent.insertBefore(node, next);
    }
   };
  
   // Override the default .detach method to offer the new functionality.
   $.fn.detach = function(async, fn) {
    return this.each(function() {
     // Call detach for each element in the collection.
     detach(this, async, fn);
    });
   };
  })(jQuery);
</script>

Test runner

$("ul input").each(function(i, e) {
 $(this).val("done " + i);
});

var elems = $('ul input').get();
for (i = 0, len = elems.length; i < len; i += 1) {
 $(elems[i]).val("done " + i);
}

$("ul input").each(function(i, e) {
 $$(this).val("done " + i);
});

var elems = $('ul input').get();
for (i = 0, len = elems.length; i < len; i += 1) {
 $$(elems[i]).val("done " + i);
}

var elems = $('ul input').get();
i = elems.length;
while (i) {
 i -= 1;
 $(elems[i]).val("done " + i);
}

var elems = $('ul input').get();
i = elems.length;
while (i) {
 i -= 1;
 $$(elems[i]).val("done " + i);
}

i = 0;
$(document.getElementsByTagName("ul")).each(function() {
 $(this.getElementsByTagName("input")).each(function() {
  $$(this).val("done " + i);
  i += 1;
 });
});

var i = 0;
$("ul input").detach(function() {
 $(this).val("done " + i);
 i += 1;
});

var i = 0;
$("ul input").detach(function() {
 $$(this).val("done " + i);
 i += 1;
});

$("ul").detach(function() {
 var ul = $(this),
     i = 0;
 ul.find("input").each(function() {
  $$(this).val("done " + i);
  i += 1;
 });
});

var k = 0;
$(document.getElementsByTagName("ul")).detach(function() {
 var elems = $$(this).find("input").get();
 for (i = 0, len = elems.length; i < len; i += 1) {
  $$(elems[i]).val("done " + k);
  k += 1;
 }
});

var k = 0;
$(document.getElementsByTagName("ul")).detach(function() {
 var elems = this.getElementsByTagName("input");
 for (i = 0, len = elems.length; i < len; i += 1) {
  $$(elems[i]).val("done " + k);
  k += 1;
 }
});

Revisions

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

• Revision 1: published by Paul Grenier on May 20, 2011
• Revision 2: published by Paul Grenier on May 20, 2011
• Revision 3: published by Paul Grenier on May 20, 2011