Skip to content

Commit 76e86ef

Browse files
mgolmgol
committed
uniqueSort: Document the new API
Also, use it in `.prevAll()` examples instead of the older `jQuery.uniqueSort()`. In addition, update jQuery used in examples to `3.7.0` and add the category for jQuery `3.7`.
1 parent 86511a7 commit 76e86ef

File tree

4 files changed

+133
-7
lines changed

4 files changed

+133
-7
lines changed

‎categories.xml

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -490,6 +490,13 @@ var files = event.originalEvent.dataTransfer.files;
490490
<hr/>
491491
]]></desc>
492492
</category>
493+
<category name="Version 3.7" slug="3.7">
494+
<desc><![CDATA[
495+
<p>Aspects of the API that were changed in the corresponding version of jQuery. TODO.</p>
496+
<p>For more information, see the <a href="TODO">Release Notes/Changelog</a></p>
497+
<hr/>
498+
]]></desc>
499+
</category>
493500
<category name="All" slug="all"/>
494501
</category>
495502
</categories>

‎entries/prevAll.xml

Lines changed: 13 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,14 @@ $( ".last-item" )
5050
&lt;div class="last-item"&gt;Last&lt;/div&gt;
5151
&lt;/div&gt;
5252
</code></pre>
53-
<p>because "Item 2" gets appended to the wrapper div first. To work around the issue, you may use <code><a href="/jQuery.uniqueSort/">$.uniqueSort()</a></code> on the <code>.prevAll()</code> output first:</p>
53+
<p>because "Item 2" gets appended to the wrapper div first. To work around the issue, you may use <code><a href="/uniqueSort/">.uniqueSort()</a></code> on the <code>.prevAll()</code> output first:</p>
54+
<pre><code>
55+
$( ".last-item" )
56+
.prevAll()
57+
.uniqueSort()
58+
.wrapAll( "&lt;div class='wrapper'&gt;&lt;/div&gt;" );
59+
</code></pre>
60+
<p>Note that the <code><a href="/uniqueSort/">.uniqueSort()</a></code> method is only available in jQuery 3.7.0 or newer. In older versions, you will need to use <code><a href="/jQuery.uniqueSort/">$.uniqueSort()</a></code> to achieve a similar effect:</p>
5461
<pre><code>
5562
var prevSiblings = $( ".last-item" ).prevAll();
5663
$.uniqueSort( prevSiblings );
@@ -83,20 +90,20 @@ $( "div" ).last().prevAll().addClass( "before" );
8390
]]></html>
8491
</example>
8592
<example>
86-
<desc>Locate all the divs preceding the last item and wrap them with a div with class <code>wrapper</code> - with or without <code><a href="/jQuery.uniqueSort/">$.uniqueSort()</a></code>.</desc>
93+
<desc>Locate all the divs preceding the last item and wrap them with a div with class <code>wrapper</code> - with or without <code><a href="/uniqueSort/">.uniqueSort()</a></code>.</desc>
8794
<code><![CDATA[
8895
$( "#container-1" )
8996
.find( ".item" )
9097
.last()
9198
.prevAll()
9299
.wrapAll( "<div class='wrapper' data-content='No uniqueSort'></div>" );
93100
94-
var prevSiblings = $( "#container-2" )
101+
$( "#container-2" )
95102
.find( ".item" )
96103
.last()
97-
.prevAll();
98-
$.uniqueSort( prevSiblings );
99-
prevSiblings.wrapAll( "<div class='wrapper' data-content='With uniqueSort'></div>" );
104+
.prevAll()
105+
.uniqueSort()
106+
.wrapAll( "<div class='wrapper' data-content='With uniqueSort'></div>" );
100107
]]></code>
101108
<css><![CDATA[
102109
body {

‎entries/uniqueSort.xml

Lines changed: 112 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,112 @@
1+
<?xml version="1.0"?>
2+
<entry type="method" name="uniqueSort" return="jQuery">
3+
<title>.uniqueSort()</title>
4+
<signature>
5+
<added>3.7</added>
6+
</signature>
7+
<desc>Sorts a jQuery object of DOM elements, in place, with the duplicates removed. Note that this only works on jQuery objects consisting of DOM elements, not strings or numbers.</desc>
8+
<longdesc>
9+
<p>The <code>.uniqueSort()</code> function searches through a jQuery object, sorting it in document order, and removing any duplicate nodes. A node is considered a duplicate if it is the <em>exact same</em> node as one already in the jQuery object; two different nodes with identical attributes are not considered to be duplicates. This function only works on jQuery objects consisting of DOM elements.</p>
10+
</longdesc>
11+
<example>
12+
<desc>Removes any duplicate elements from the jQuery object of divs.</desc>
13+
<code><![CDATA[
14+
var divs = $( "div" ).get();
15+
16+
// Add 3 elements of class dup too (they are divs)
17+
divs = divs.concat( $( ".dup" ).get() );
18+
19+
// Create a jQuery object from `divs`.
20+
var elems = $( divs );
21+
22+
$( "div" )
23+
.eq( 1 )
24+
.text( "Pre-uniqueSort there are " + elems.length + " elements in the collection." );
25+
26+
elems = elems.uniqueSort();
27+
28+
$( "div" )
29+
.eq( 2 )
30+
.text( "Post-uniqueSort there are " + elems.length + " elements in the collection." )
31+
.css( "color", "red" );
32+
]]></code>
33+
<css><![CDATA[
34+
div {
35+
color: blue;
36+
}
37+
]]></css>
38+
<html><![CDATA[
39+
<div>There are 6 divs in this document.</div>
40+
<div></div>
41+
<div class="dup"></div>
42+
<div class="dup"></div>
43+
<div class="dup"></div>
44+
<div></div>
45+
]]></html>
46+
</example>
47+
<example>
48+
<desc>Locate all the divs preceding the last item and wrap them with a div with class <code>wrapper</code> - with or without <code><a href="/uniqueSort/">.uniqueSort()</a></code>.</desc>
49+
<code><![CDATA[
50+
$( "#container-1" )
51+
.find( ".item" )
52+
.last()
53+
.prevAll()
54+
.wrapAll( "<div class='wrapper' data-content='No uniqueSort'></div>" );
55+
56+
$( "#container-2" )
57+
.find( ".item" )
58+
.last()
59+
.prevAll()
60+
.uniqueSort()
61+
.wrapAll( "<div class='wrapper' data-content='With uniqueSort'></div>" );
62+
]]></code>
63+
<css><![CDATA[
64+
body {
65+
display: flex;
66+
}
67+
.container {
68+
display: flex;
69+
margin: 10px 50px 10px 10px;
70+
}
71+
.wrapper {
72+
position: relative;
73+
display: flex;
74+
padding: 30px 10px 10px 10px;
75+
background: #def;
76+
border: 2px solid black;
77+
}
78+
.wrapper::before {
79+
content: attr(data-content);
80+
position: absolute;
81+
top: 15px;
82+
left: 15px;
83+
}
84+
.item {
85+
display: flex;
86+
justify-content: center;
87+
align-items: center;
88+
width: 70px;
89+
height: 70px;
90+
background: #abc;
91+
border: 2px solid black;
92+
margin: 10px;
93+
font-size: 50px;
94+
}
95+
]]></css>
96+
<html><![CDATA[
97+
<div class="container" id="container-1">
98+
<div class="item">1</div>
99+
<div class="item">2</div>
100+
<div class="item">3</div>
101+
</div>
102+
103+
<div class="container" id="container-2">
104+
<div class="item">1</div>
105+
<div class="item">2</div>
106+
<div class="item">3</div>
107+
</div>
108+
]]></html>
109+
</example>
110+
<category slug="utilities"/>
111+
<category slug="version/3.7"/>
112+
</entry>

‎entries2html.xsl

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@
1212
&lt;meta charset="utf-8"&gt;
1313
&lt;title&gt;<xsl:value-of select="//entry/@name"/> demo&lt;/title&gt;<xsl:if test="css">
1414
&lt;style&gt;<xsl:value-of select="css/text()"/> &lt;/style&gt;</xsl:if>
15-
&lt;script src="https://code.jquery.com/jquery-3.5.0.js"&gt;&lt;/script&gt;<xsl:if test="code/@location='head'">
15+
&lt;script src="https://code.jquery.com/jquery-3.x-git.js"&gt;&lt;/script&gt;<xsl:if test="code/@location='head'">
1616
&lt;script&gt;
1717
<xsl:copy-of select="code/text()"/>
1818
&lt;/script&gt;

0 commit comments

Comments
 (0)