jQuery CSS3 Not vs. .Not() (v42)

Revision 42 of this benchmark created by Hank on

Preparation HTML

<div id="container">
      <div>Div</div>
      <div>Div</div>
      <div class="test">Div</div>
      <div>Div</div>
      <div>Div</div>
      <div class="test">Div</div>
      <div>Div</div>
      <div>Div</div>
      <div class="test" id="header"> Header </div>
      <div>Div</div>
      <div>Div</div>
      <div>Div</div>
      <div>Div</div>
      <div class="test">Div</div>
      <div>Div</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

Test runner

Ready to run.

Testing in
TestOps/sec
CSS3 Selector
var d = $('div');

var len = d.filter('.test:not(#header)').length;
ready
Not() then filter()
var d = $('div');

var len = d.not('#header').filter('.test').length;
ready
filter() then not()
var d = $('div');

var len = d.filter('.test').not('#header').length;
ready
CSS3 Selector (:not)
var d = $('div');

var len = d.filter(':not(.test):not(#header)').length;
ready
Filter selector (not)
var d = $('div');

var len = d.not('.test').not('#header').length;
ready

Revisions

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