Improved docs for append, prepend, before and after, merging the three pairs into one
This commit is contained in:
parent
4805a45c06
commit
ca438a718a
|
@ -19,6 +19,7 @@ New and Noteworthy
|
||||||
- You can now unbind event handlers from within themselves
|
- You can now unbind event handlers from within themselves
|
||||||
- Documented filter(Function)
|
- Documented filter(Function)
|
||||||
- Improved docs for FX module, merging method descriptions and marking optional arguments
|
- Improved docs for FX module, merging method descriptions and marking optional arguments
|
||||||
|
- Improved docs for append, prepend, before and after, merging the three pairs into one
|
||||||
|
|
||||||
1.0.4
|
1.0.4
|
||||||
-----
|
-----
|
||||||
|
|
36
src/jquery/coreTest.js
vendored
36
src/jquery/coreTest.js
vendored
|
@ -170,8 +170,8 @@ test("wrap(String|Element)", function() {
|
||||||
ok( result.text() == defaultText, 'Check for element wrapping' );
|
ok( result.text() == defaultText, 'Check for element wrapping' );
|
||||||
});
|
});
|
||||||
|
|
||||||
test("append(String|Element|Array<Element>)", function() {
|
test("append(String|Element|Array<Element>|jQuery)", function() {
|
||||||
expect(4);
|
expect(5);
|
||||||
var defaultText = 'Try them out:'
|
var defaultText = 'Try them out:'
|
||||||
var result = $('#first').append('<b>buga</b>');
|
var result = $('#first').append('<b>buga</b>');
|
||||||
ok( result.text() == defaultText + 'buga', 'Check if text appending works' );
|
ok( result.text() == defaultText + 'buga', 'Check if text appending works' );
|
||||||
|
@ -186,10 +186,15 @@ test("append(String|Element|Array<Element>)", function() {
|
||||||
expected = "This link has class=\"blog\": Simon Willison's WeblogTry them out:Yahoo";
|
expected = "This link has class=\"blog\": Simon Willison's WeblogTry them out:Yahoo";
|
||||||
$('#sap').append([document.getElementById('first'), document.getElementById('yahoo')]);
|
$('#sap').append([document.getElementById('first'), document.getElementById('yahoo')]);
|
||||||
ok( expected == $('#sap').text(), "Check for appending of array of elements" );
|
ok( expected == $('#sap').text(), "Check for appending of array of elements" );
|
||||||
|
|
||||||
|
reset();
|
||||||
|
expected = "This link has class=\"blog\": Simon Willison's WeblogTry them out:Yahoo";
|
||||||
|
$('#sap').append($("#first, #yahoo"));
|
||||||
|
ok( expected == $('#sap').text(), "Check for appending of jQuery object" );
|
||||||
});
|
});
|
||||||
|
|
||||||
test("prepend(String|Element|Array<Element>)", function() {
|
test("prepend(String|Element|Array<Element>|jQuery)", function() {
|
||||||
expect(4);
|
expect(5);
|
||||||
var defaultText = 'Try them out:'
|
var defaultText = 'Try them out:'
|
||||||
var result = $('#first').prepend('<b>buga</b>');
|
var result = $('#first').prepend('<b>buga</b>');
|
||||||
ok( result.text() == 'buga' + defaultText, 'Check if text prepending works' );
|
ok( result.text() == 'buga' + defaultText, 'Check if text prepending works' );
|
||||||
|
@ -204,10 +209,15 @@ test("prepend(String|Element|Array<Element>)", function() {
|
||||||
expected = "Try them out:YahooThis link has class=\"blog\": Simon Willison's Weblog";
|
expected = "Try them out:YahooThis link has class=\"blog\": Simon Willison's Weblog";
|
||||||
$('#sap').prepend([document.getElementById('first'), document.getElementById('yahoo')]);
|
$('#sap').prepend([document.getElementById('first'), document.getElementById('yahoo')]);
|
||||||
ok( expected == $('#sap').text(), "Check for prepending of array of elements" );
|
ok( expected == $('#sap').text(), "Check for prepending of array of elements" );
|
||||||
|
|
||||||
|
reset();
|
||||||
|
expected = "Try them out:YahooThis link has class=\"blog\": Simon Willison's Weblog";
|
||||||
|
$('#sap').prepend($("#first, #yahoo"));
|
||||||
|
ok( expected == $('#sap').text(), "Check for prepending of jQuery object" );
|
||||||
});
|
});
|
||||||
|
|
||||||
test("before(String|Element|Array<Element>)", function() {
|
test("before(String|Element|Array<Element>|jQuery)", function() {
|
||||||
expect(3);
|
expect(4);
|
||||||
var expected = 'This is a normal link: bugaYahoo';
|
var expected = 'This is a normal link: bugaYahoo';
|
||||||
$('#yahoo').before('<b>buga</b>');
|
$('#yahoo').before('<b>buga</b>');
|
||||||
ok( expected == $('#en').text(), 'Insert String before' );
|
ok( expected == $('#en').text(), 'Insert String before' );
|
||||||
|
@ -221,10 +231,15 @@ test("before(String|Element|Array<Element>)", function() {
|
||||||
expected = "This is a normal link: Try them out:diveintomarkYahoo";
|
expected = "This is a normal link: Try them out:diveintomarkYahoo";
|
||||||
$('#yahoo').before([document.getElementById('first'), document.getElementById('mark')]);
|
$('#yahoo').before([document.getElementById('first'), document.getElementById('mark')]);
|
||||||
ok( expected == $('#en').text(), "Insert array of elements before" );
|
ok( expected == $('#en').text(), "Insert array of elements before" );
|
||||||
|
|
||||||
|
reset();
|
||||||
|
expected = "This is a normal link: Try them out:diveintomarkYahoo";
|
||||||
|
$('#yahoo').before($("#first, #mark"));
|
||||||
|
ok( expected == $('#en').text(), "Insert jQuery before" );
|
||||||
});
|
});
|
||||||
|
|
||||||
test("after(String|Element|Array<Element>)", function() {
|
test("after(String|Element|Array<Element>|jQuery)", function() {
|
||||||
expect(3);
|
expect(4);
|
||||||
var expected = 'This is a normal link: Yahoobuga';
|
var expected = 'This is a normal link: Yahoobuga';
|
||||||
$('#yahoo').after('<b>buga</b>');
|
$('#yahoo').after('<b>buga</b>');
|
||||||
ok( expected == $('#en').text(), 'Insert String after' );
|
ok( expected == $('#en').text(), 'Insert String after' );
|
||||||
|
@ -238,6 +253,11 @@ test("after(String|Element|Array<Element>)", function() {
|
||||||
expected = "This is a normal link: YahooTry them out:diveintomark";
|
expected = "This is a normal link: YahooTry them out:diveintomark";
|
||||||
$('#yahoo').after([document.getElementById('first'), document.getElementById('mark')]);
|
$('#yahoo').after([document.getElementById('first'), document.getElementById('mark')]);
|
||||||
ok( expected == $('#en').text(), "Insert array of elements after" );
|
ok( expected == $('#en').text(), "Insert array of elements after" );
|
||||||
|
|
||||||
|
reset();
|
||||||
|
expected = "This is a normal link: YahooTry them out:diveintomark";
|
||||||
|
$('#yahoo').after($("#first, #mark"));
|
||||||
|
ok( expected == $('#en').text(), "Insert jQuery after" );
|
||||||
});
|
});
|
||||||
|
|
||||||
test("end()", function() {
|
test("end()", function() {
|
||||||
|
|
120
src/jquery/jquery.js
vendored
120
src/jquery/jquery.js
vendored
|
@ -600,8 +600,8 @@ jQuery.fn = jQuery.prototype = {
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Append any number of elements to the inside of every matched elements,
|
* Append content to the inside of every matched element.
|
||||||
* generated from the provided HTML.
|
*
|
||||||
* This operation is similar to doing an appendChild to all the
|
* This operation is similar to doing an appendChild to all the
|
||||||
* specified elements, adding them into the document.
|
* specified elements, adding them into the document.
|
||||||
*
|
*
|
||||||
|
@ -609,40 +609,21 @@ jQuery.fn = jQuery.prototype = {
|
||||||
* @before <p>I would like to say: </p>
|
* @before <p>I would like to say: </p>
|
||||||
* @result <p>I would like to say: <b>Hello</b></p>
|
* @result <p>I would like to say: <b>Hello</b></p>
|
||||||
*
|
*
|
||||||
* @name append
|
|
||||||
* @type jQuery
|
|
||||||
* @param String html A string of HTML, that will be created on the fly and appended to the target.
|
|
||||||
* @cat DOM/Manipulation
|
|
||||||
*/
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Append an element to the inside of all matched elements.
|
|
||||||
* This operation is similar to doing an appendChild to all the
|
|
||||||
* specified elements, adding them into the document.
|
|
||||||
*
|
|
||||||
* @example $("p").append( $("#foo")[0] );
|
* @example $("p").append( $("#foo")[0] );
|
||||||
* @before <p>I would like to say: </p><b id="foo">Hello</b>
|
* @before <p>I would like to say: </p><b id="foo">Hello</b>
|
||||||
* @result <p>I would like to say: <b id="foo">Hello</b></p>
|
* @result <p>I would like to say: <b id="foo">Hello</b></p>
|
||||||
*
|
*
|
||||||
* @name append
|
|
||||||
* @type jQuery
|
|
||||||
* @param Element elem A DOM element that will be appended.
|
|
||||||
* @cat DOM/Manipulation
|
|
||||||
*/
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Append any number of elements to the inside of all matched elements.
|
|
||||||
* This operation is similar to doing an appendChild to all the
|
|
||||||
* specified elements, adding them into the document.
|
|
||||||
*
|
|
||||||
* @example $("p").append( $("b") );
|
* @example $("p").append( $("b") );
|
||||||
* @before <p>I would like to say: </p><b>Hello</b>
|
* @before <p>I would like to say: </p><b>Hello</b>
|
||||||
* @result <p>I would like to say: <b>Hello</b></p>
|
* @result <p>I would like to say: <b>Hello</b></p>
|
||||||
*
|
*
|
||||||
* @name append
|
* @name append
|
||||||
* @type jQuery
|
* @type jQuery
|
||||||
* @param Array<Element> elems An array of elements, all of which will be appended.
|
* @param <Content> content Content to append to the target
|
||||||
* @cat DOM/Manipulation
|
* @cat DOM/Manipulation
|
||||||
|
* @see prepend(<Content>)
|
||||||
|
* @see before(<Content>)
|
||||||
|
* @see after(<Content>)
|
||||||
*/
|
*/
|
||||||
append: function() {
|
append: function() {
|
||||||
return this.domManip(arguments, true, 1, function(a){
|
return this.domManip(arguments, true, 1, function(a){
|
||||||
|
@ -651,49 +632,30 @@ jQuery.fn = jQuery.prototype = {
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Prepend any number of elements to the inside of every matched elements,
|
* Prepend content to the inside of every matched element.
|
||||||
* generated from the provided HTML.
|
*
|
||||||
* This operation is the best way to insert dynamically created elements
|
* This operation is the best way to insert elements
|
||||||
* inside, at the beginning, of all the matched element.
|
* inside, at the beginning, of all matched elements.
|
||||||
*
|
*
|
||||||
* @example $("p").prepend("<b>Hello</b>");
|
* @example $("p").prepend("<b>Hello</b>");
|
||||||
* @before <p>I would like to say: </p>
|
* @before <p>I would like to say: </p>
|
||||||
* @result <p><b>Hello</b>I would like to say: </p>
|
* @result <p><b>Hello</b>I would like to say: </p>
|
||||||
*
|
*
|
||||||
* @name prepend
|
|
||||||
* @type jQuery
|
|
||||||
* @param String html A string of HTML, that will be created on the fly and appended to the target.
|
|
||||||
* @cat DOM/Manipulation
|
|
||||||
*/
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Prepend an element to the inside of all matched elements.
|
|
||||||
* This operation is the best way to insert an element inside, at the
|
|
||||||
* beginning, of all the matched element.
|
|
||||||
*
|
|
||||||
* @example $("p").prepend( $("#foo")[0] );
|
* @example $("p").prepend( $("#foo")[0] );
|
||||||
* @before <p>I would like to say: </p><b id="foo">Hello</b>
|
* @before <p>I would like to say: </p><b id="foo">Hello</b>
|
||||||
* @result <p><b id="foo">Hello</b>I would like to say: </p>
|
* @result <p><b id="foo">Hello</b>I would like to say: </p>
|
||||||
*
|
*
|
||||||
* @name prepend
|
|
||||||
* @type jQuery
|
|
||||||
* @param Element elem A DOM element that will be appended.
|
|
||||||
* @cat DOM/Manipulation
|
|
||||||
*/
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Prepend any number of elements to the inside of all matched elements.
|
|
||||||
* This operation is the best way to insert a set of elements inside, at the
|
|
||||||
* beginning, of all the matched element.
|
|
||||||
*
|
|
||||||
* @example $("p").prepend( $("b") );
|
* @example $("p").prepend( $("b") );
|
||||||
* @before <p>I would like to say: </p><b>Hello</b>
|
* @before <p>I would like to say: </p><b>Hello</b>
|
||||||
* @result <p><b>Hello</b>I would like to say: </p>
|
* @result <p><b>Hello</b>I would like to say: </p>
|
||||||
*
|
*
|
||||||
* @name prepend
|
* @name prepend
|
||||||
* @type jQuery
|
* @type jQuery
|
||||||
* @param Array<Element> elems An array of elements, all of which will be appended.
|
* @param <Content> content Content to prepend to the target.
|
||||||
* @cat DOM/Manipulation
|
* @cat DOM/Manipulation
|
||||||
|
* @see append(<Content>)
|
||||||
|
* @see before(<Content>)
|
||||||
|
* @see after(<Content>)
|
||||||
*/
|
*/
|
||||||
prepend: function() {
|
prepend: function() {
|
||||||
return this.domManip(arguments, true, -1, function(a){
|
return this.domManip(arguments, true, -1, function(a){
|
||||||
|
@ -702,43 +664,27 @@ jQuery.fn = jQuery.prototype = {
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Insert any number of dynamically generated elements before each of the
|
* Insert content before each of the matched elements.
|
||||||
* matched elements.
|
|
||||||
*
|
*
|
||||||
* @example $("p").before("<b>Hello</b>");
|
* @example $("p").before("<b>Hello</b>");
|
||||||
* @before <p>I would like to say: </p>
|
* @before <p>I would like to say: </p>
|
||||||
* @result <b>Hello</b><p>I would like to say: </p>
|
* @result <b>Hello</b><p>I would like to say: </p>
|
||||||
*
|
*
|
||||||
* @name before
|
|
||||||
* @type jQuery
|
|
||||||
* @param String html A string of HTML, that will be created on the fly and appended to the target.
|
|
||||||
* @cat DOM/Manipulation
|
|
||||||
*/
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Insert an element before each of the matched elements.
|
|
||||||
*
|
|
||||||
* @example $("p").before( $("#foo")[0] );
|
* @example $("p").before( $("#foo")[0] );
|
||||||
* @before <p>I would like to say: </p><b id="foo">Hello</b>
|
* @before <p>I would like to say: </p><b id="foo">Hello</b>
|
||||||
* @result <b id="foo">Hello</b><p>I would like to say: </p>
|
* @result <b id="foo">Hello</b><p>I would like to say: </p>
|
||||||
*
|
*
|
||||||
* @name before
|
|
||||||
* @type jQuery
|
|
||||||
* @param Element elem A DOM element that will be appended.
|
|
||||||
* @cat DOM/Manipulation
|
|
||||||
*/
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Insert any number of elements before each of the matched elements.
|
|
||||||
*
|
|
||||||
* @example $("p").before( $("b") );
|
* @example $("p").before( $("b") );
|
||||||
* @before <p>I would like to say: </p><b>Hello</b>
|
* @before <p>I would like to say: </p><b>Hello</b>
|
||||||
* @result <b>Hello</b><p>I would like to say: </p>
|
* @result <b>Hello</b><p>I would like to say: </p>
|
||||||
*
|
*
|
||||||
* @name before
|
* @name before
|
||||||
* @type jQuery
|
* @type jQuery
|
||||||
* @param Array<Element> elems An array of elements, all of which will be appended.
|
* @param <Content> content Content to insert before each target.
|
||||||
* @cat DOM/Manipulation
|
* @cat DOM/Manipulation
|
||||||
|
* @see append(<Content>)
|
||||||
|
* @see prepend(<Content>)
|
||||||
|
* @see after(<Content>)
|
||||||
*/
|
*/
|
||||||
before: function() {
|
before: function() {
|
||||||
return this.domManip(arguments, false, 1, function(a){
|
return this.domManip(arguments, false, 1, function(a){
|
||||||
|
@ -747,43 +693,27 @@ jQuery.fn = jQuery.prototype = {
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Insert any number of dynamically generated elements after each of the
|
* Insert content after each of the matched elements.
|
||||||
* matched elements.
|
|
||||||
*
|
*
|
||||||
* @example $("p").after("<b>Hello</b>");
|
* @example $("p").after("<b>Hello</b>");
|
||||||
* @before <p>I would like to say: </p>
|
* @before <p>I would like to say: </p>
|
||||||
* @result <p>I would like to say: </p><b>Hello</b>
|
* @result <p>I would like to say: </p><b>Hello</b>
|
||||||
*
|
*
|
||||||
* @name after
|
|
||||||
* @type jQuery
|
|
||||||
* @param String html A string of HTML, that will be created on the fly and appended to the target.
|
|
||||||
* @cat DOM/Manipulation
|
|
||||||
*/
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Insert an element after each of the matched elements.
|
|
||||||
*
|
|
||||||
* @example $("p").after( $("#foo")[0] );
|
* @example $("p").after( $("#foo")[0] );
|
||||||
* @before <b id="foo">Hello</b><p>I would like to say: </p>
|
* @before <b id="foo">Hello</b><p>I would like to say: </p>
|
||||||
* @result <p>I would like to say: </p><b id="foo">Hello</b>
|
* @result <p>I would like to say: </p><b id="foo">Hello</b>
|
||||||
*
|
*
|
||||||
* @name after
|
|
||||||
* @type jQuery
|
|
||||||
* @param Element elem A DOM element that will be appended.
|
|
||||||
* @cat DOM/Manipulation
|
|
||||||
*/
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Insert any number of elements after each of the matched elements.
|
|
||||||
*
|
|
||||||
* @example $("p").after( $("b") );
|
* @example $("p").after( $("b") );
|
||||||
* @before <b>Hello</b><p>I would like to say: </p>
|
* @before <b>Hello</b><p>I would like to say: </p>
|
||||||
* @result <p>I would like to say: </p><b>Hello</b>
|
* @result <p>I would like to say: </p><b>Hello</b>
|
||||||
*
|
*
|
||||||
* @name after
|
* @name after
|
||||||
* @type jQuery
|
* @type jQuery
|
||||||
* @param Array<Element> elems An array of elements, all of which will be appended.
|
* @param <Content> content Content to insert after each target.
|
||||||
* @cat DOM/Manipulation
|
* @cat DOM/Manipulation
|
||||||
|
* @see append(<Content>)
|
||||||
|
* @see prepend(<Content>)
|
||||||
|
* @see before(<Content>)
|
||||||
*/
|
*/
|
||||||
after: function() {
|
after: function() {
|
||||||
return this.domManip(arguments, false, -1, function(a){
|
return this.domManip(arguments, false, -1, function(a){
|
||||||
|
@ -796,6 +726,8 @@ jQuery.fn = jQuery.prototype = {
|
||||||
* back to its previous state. After an end operation, the list of matched elements will
|
* back to its previous state. After an end operation, the list of matched elements will
|
||||||
* revert to the last state of matched elements.
|
* revert to the last state of matched elements.
|
||||||
*
|
*
|
||||||
|
* If there was no destructive operation before, an empty set is returned.
|
||||||
|
*
|
||||||
* @example $("p").find("span").end();
|
* @example $("p").find("span").end();
|
||||||
* @before <p><span>Hello</span>, how are you?</p>
|
* @before <p><span>Hello</span>, how are you?</p>
|
||||||
* @result $("p").find("span").end() == [ <p>...</p> ]
|
* @result $("p").find("span").end() == [ <p>...</p> ]
|
||||||
|
|
Loading…
Reference in a new issue