HTML Preparation code:
x
 
1
<ul id="filtration">
2
                    <li class="first">Urval</li>
3
                    <li>
4
                        <div class="selectContainer filtration">
5
                            <select id="filterType" class="filtration" multiple="multiple" size="1" autocomplete="off" style="visibility: hidden; ">
6
                                <option value="">Typ</option>
7
                                <option value="Klänningar">Klänningar</option>
8
                                <option value="Byxor" selected="selected">Byxor</option>
9
                                <option value="Toppar">Toppar</option>
10
                            </select>
11
                        <a class="dropdown ischanged"><span class="toggle"></span><span>Byxor</span></a><ul class="DD_values bullets" style="display: none; "><li><a href="#" data-val="Klänningar"><span>Klänningar</span></a></li><li><a href="#" data-val="Byxor" class="selected"><span>Byxor</span></a></li><li><a href="#" data-val="Toppar"><span>Toppar</span></a></li></ul></div>
12
                    </li>
13
                    <li>
14
                        <div class="selectContainer filtration">
15
                            <select id="filterColor" class="filtration" multiple="multiple" autocomplete="off" style="visibility: hidden; ">
16
                                <option value="">Färg</option>
17
                                <option value="red">Röd</option>
18
                                <option value="green">Grön</option>
19
                                <option value="blue">Blå</option>
20
                            </select>
21
                        <a class="dropdown"><span class="toggle"></span><span>Färg</span></a><ul class="DD_values bullets" style="display: none; "><li><a href="#" data-val="red"><span>Röd</span></a></li><li><a href="#" data-val="green"><span>Grön</span></a></li><li><a href="#" data-val="blue"><span>Blå</span></a></li></ul></div>
22
                    </li>
23
                    <li>
24
                        <div class="selectContainer filtration">
25
                            <select id="filterSize" class="filtration" autocomplete="off" style="visibility: hidden; ">
26
                                <option value="">Storlek</option>
27
                                <option value="XS">XS</option>
28
                                <option value="S">S</option>
29
                                <option value="M">M</option>
30
                                <option value="L">L</option>
31
                                <option value="XL">XL</option>
32
                            </select>
33
                        <a class="dropdown"><span class="toggle"></span><span>Storlek</span></a><ul class="DD_values bullets" style="display: none; "><li><a href="#" data-val="XS"><span>XS</span></a></li><li><a href="#" data-val="S"><span>S</span></a></li><li><a href="#" data-val="M"><span>M</span></a></li><li><a href="#" data-val="L"><span>L</span></a></li><li><a href="#" data-val="XL"><span>XL</span></a></li></ul></div>
34
                    </li>
35
                    <li class="sort">Sortering</li>
36
                    <li>
37
                        <div class="selectContainer filtration">
38
                            <select id="sortBy" class="filtration" autocomplete="off" style="visibility: hidden; ">
39
                                <option value="senast" selected="selected">Senast inkommet</option>
40
                                <option value="stigande">Stigande pris</option>
41
                                <option value="fallande">Fallande pris</option>
42
                            </select>
43
                        <a class="dropdown ischanged"><span class="toggle"></span><span>Senast inkommet</span></a><ul class="DD_values bullets" style="display: none; "><li><a href="#" data-val="senast" class="selected"><span>Senast inkommet</span></a></li><li><a href="#" data-val="stigande"><span>Stigande pris</span></a></li><li><a href="#" data-val="fallande"><span>Fallande pris</span></a></li></ul></div>
44
                    </li>
45
                    <li class="last"><a href="" class="clear_filt"><span>Visa</span></a>(50)</li>
46
                </ul>
47
48
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
49
<script>
50
  var denna = $("#filterType"),
51
  idn;
52
</script>
Tests:
  • parent

     
    idn = denna.attr("id");
    console.log($('select.filtration').not('#'+idn));
  • parent().parent()

     
    console.log(denna.parent().parent().siblings().find('select'));
  • Closest

     
    console.log(denna.closest('li').siblings().find('select'));
  • Parents(li)

     
    console.log(denna.parents('li').siblings().find('select'));
  • Parent 2

     
    console.log(denna.parent());
  • Closest 2

     
    console.log(denna.closest('li'));
Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Experimental features:

  • Test case name Result
    parent
    parent().parent()
    Closest
    Parents(li)
    Parent 2
    Closest 2

    Fastest: N/A

    Slowest: N/A

Latest run results:
Run details: (Test run date: 4 years ago)
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.116 Safari/537.36
Chrome 83 on Mac OS X 10.15.5
View result in a separate tab
Test name Executions per second
parent 31936.2 Ops/sec
parent().parent() 36033.7 Ops/sec
Closest 31450.6 Ops/sec
Parents(li) 30110.2 Ops/sec
Parent 2 55009.9 Ops/sec
Closest 2 45501.2 Ops/sec