You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
* Use second-person pronoun ("you") when necessary, but try to avoid it.
36
38
* Favor the definite article ("the") over second-person possesive ("your").
37
39
***Yes**: Insert the paragraph after the unordered list.
@@ -41,27 +43,32 @@ To build and deploy your changes for previewing in a [jquery-wp-content](https:/
41
43
***No**: And now we have our paragraph beneath the unordered list.
42
44
43
45
#### "Voice"
46
+
44
47
* Prefer active voice over passive.
45
48
***Active**: Calling `.click()` binds a click handler to the elements in the collection
46
49
***Passive**: Click handlers are bound to elements in the collection when `.click()` is called
47
50
48
51
### Code Style
49
-
Code in the API documentation should follow the [jQuery Core Style Guide](http://docs.jquery.com/JQuery_Core_Style_Guidelines) with the following addition:
52
+
53
+
Code in the API documentation should follow the [jQuery Core Style Guide](http://contribute.jquery.org/style-guide/) with the following addition:
50
54
51
55
***Document ready syntax**: Use `$( document ).ready(function() {` instead of `$(function() {` as it's harder for new users to distinguish the difference between the latter and an IIFE.
52
56
53
57
#### Code within prose content (paragraphs and the like):
54
-
* Methods: use a dot, followed by the method name, followed by parentheses: e.g. The `.focus()` method is a shortcut for `.bind('focus', handler)` in the first and second variations, and `.trigger('focus')` in the third.
58
+
59
+
* Methods: use a dot, followed by the method name, followed by parentheses: e.g. The `.focus()` method is a shortcut for `.on( "focus", handler )` in the first and second variations, and `.trigger( "focus" )` in the third.
55
60
* Properties: use a dot, followed by the property name: e.g. `.length`.
56
61
* Functions: use the function name, followed by parentheses: `myFunction()`.
57
62
58
63
#### Examples
64
+
59
65
* Examples should indicate what the expected result will be before presenting the code. This makes code clearer and skimming easier, especially for newer coders who may not understand what is supposed to be happening from reading the code itself.
60
66
***Yes**: Find all p elements that are children of a div element and apply a border to them.
61
67
***No**: Find all p elements that are children of a div element.
62
68
* Make your example easy to follow with good comments so that the explanation isn't necessary.
Copy file name to clipboardExpand all lines: entries/add.xml
+18-17Lines changed: 18 additions & 17 deletions
Original file line number
Diff line number
Diff line change
@@ -37,17 +37,17 @@
37
37
<desc>Add elements to the set of matched elements.</desc>
38
38
<longdesc>
39
39
<p>Given a jQuery object that represents a set of DOM elements, the <code>.add()</code> method constructs a new jQuery object from the union of those elements and the ones passed into the method. The argument to <code>.add()</code> can be pretty much anything that <code>$()</code> accepts, including a jQuery selector expression, references to DOM elements, or an HTML snippet.</p>
40
-
<p>Do not assume that this method appends the elements to the existing collection in the order they are passed to the <code>.add()</code> method. When all elements are members of the same document, the resulting collection from <code>.add()</code> will be sorted in document order; that is, in order of each element's appearance in the document. If the collection consists of elements from different documents or ones not in any document, the sort order is undefined. To create a jQuery object with elements in a well-defined order, use the <code>$(array_of_DOM_elements)</code> signature.</p>
40
+
<p>Do not assume that this method appends the elements to the existing collection in the order they are passed to the <code>.add()</code> method. When all elements are members of the same document, the resulting collection from <code>.add()</code> will be sorted in document order; that is, in order of each element's appearance in the document. If the collection consists of elements from different documents or ones not in any document, the sort order is undefined. To create a jQuery object with elements in a well-defined order, use the <code>$(array_of_DOM_elements)</code> signature.</p>
41
41
<p>The updated set of elements can be used in a following (chained) method, or assigned to a variable for later use. For example:</p>
42
42
<pre><code>
43
43
$( "p" ).add( "div" ).addClass( "widget" );
44
44
var pdiv = $( "p" ).add( "div" );
45
-
</code></pre>
45
+
</code></pre>
46
46
<p>The following will <em>not</em> save the added elements, because the <code>.add()</code> method creates a new set and leaves the original set in pdiv unchanged:</p>
47
47
<pre><code>
48
48
var pdiv = $( "p" );
49
49
pdiv.add( "div" ); // WRONG, pdiv will not change
50
-
</code></pre>
50
+
</code></pre>
51
51
<p>Consider a page with a simple list and a paragraph following it:</p>
52
52
<pre><code>
53
53
<ul>
@@ -56,9 +56,11 @@ pdiv.add( "div" ); // WRONG, pdiv will not change
56
56
<li>list item 3</li>
57
57
</ul>
58
58
<p>a paragraph</p>
59
-
</code></pre>
59
+
</code></pre>
60
60
<p>We can select the list items and then the paragraph by using either a selector or a reference to the DOM element itself as the <code>.add()</code> method's argument:</p>
<p>First, the initial selector locates item 3, initializing the stack with the set containing just this item. The call to <code>.nextAll()</code> then pushes the set of items 4 and 5 onto the stack. Finally, the <code>.addBack()</code> invocation merges these two sets together, creating a jQuery object that points to all three items in document order: <code>{[<li.third-item>,<li>,<li> ]}</code>.</p>
Copy file name to clipboardExpand all lines: entries/after.xml
+25-17Lines changed: 25 additions & 17 deletions
Original file line number
Diff line number
Diff line change
@@ -27,17 +27,20 @@
27
27
<longdesc>
28
28
<p>The <code>.after()</code> and <code><ahref="/insertAfter">.insertAfter()</a></code> methods perform the same task. The major difference is in the syntax—specifically, in the placement of the content and target. With <code>.after()</code>, the selector expression preceding the method is the container after which the content is inserted. With <code>.insertAfter()</code>, on the other hand, the content precedes the method, either as a selector expression or as markup created on the fly, and it is inserted after the target container.</p>
29
29
<p>Using the following HTML:</p>
30
-
<pre><code><div class="container">
30
+
<pre><code>
31
+
<div class="container">
31
32
<h2>Greetings</h2>
32
33
<div class="inner">Hello</div>
33
34
<div class="inner">Goodbye</div>
34
-
</div></code></pre>
35
+
</div>
36
+
</code></pre>
35
37
<p>Content can be created and then inserted after several elements at once:</p>
36
38
<pre><code>
37
39
$( ".inner" ).after( "<p>Test</p>" );
38
40
</code></pre>
39
41
<p>Each inner <code><div></code> element gets this new content:</p>
<p>The result is a jQuery set containing a div and a paragraph, in that order. That set can be further manipulated, even before it is inserted in the document.</p>
<p>Since <code>.after()</code> can accept any number of additional arguments, the same result can be achieved by passing in the three <code><div></code>s as three separate arguments, like so: <code>$( "p" ).first().after( $newdiv1, newdiv2, existingdiv1 )</code>. The type and number of arguments will largely depend on the elements that are collected in the code.</p>
Copy file name to clipboardExpand all lines: entries/ajaxComplete.xml
+20-12Lines changed: 20 additions & 12 deletions
Original file line number
Diff line number
Diff line change
@@ -11,36 +11,44 @@
11
11
<longdesc>
12
12
<p>Whenever an Ajax request completes, jQuery triggers the <code>ajaxComplete</code> event. Any and all handlers that have been registered with the <code>.ajaxComplete()</code> method are executed at this time.</p>
13
13
<p>To observe this method in action, set up a basic Ajax load request:</p>
<p>Now, make an Ajax request using any jQuery method:</p>
24
-
<pre><code>$( ".trigger" ).click(function() {
26
+
<pre><code>
27
+
$( ".trigger" ).click(function() {
25
28
$( ".result" ).load( "ajax/test.html" );
26
-
});</code></pre>
29
+
});
30
+
</code></pre>
27
31
<p>When the user clicks the element with class <code>trigger</code> and the Ajax request completes, the log message is displayed.</p>
28
32
<p><strong>As of jQuery 1.8, the <code>.ajaxComplete()</code> method should only be attached to <code>document</code>.</strong></p>
29
33
<p>All <code>ajaxComplete</code> handlers are invoked, regardless of what Ajax request was completed. If you must differentiate between the requests, use the parameters passed to the handler. Each time an <code>ajaxComplete</code> handler is executed, it is passed the event object, the <code>XMLHttpRequest</code> object, and the settings object that was used in the creation of the request. For example, you can restrict the callback to only handling events dealing with a particular URL:</p>
$( ".log" ).text( "Triggered ajaxComplete handler. The result is " +
33
-
xhr.responseHTML );
38
+
xhr.responseHTML );
34
39
}
35
-
});</code></pre>
40
+
});
41
+
</code></pre>
36
42
<p><strong>Note:</strong> You can get the returned ajax contents by looking at <code>xhr.responseXML</code> or <code>xhr.responseHTML</code> for xml and html respectively.</p>
0 commit comments