jQuery append() – toegevoegde elementen retourneren

Ik gebruik jQuery.append()om enkele elementen dynamisch toe te voegen. Is er een manier om een ​​jQuery-verzameling of array van deze nieuw ingevoegde elementen te krijgen?

Dus ik wil dit doen:

$("#myDiv").append(newHtml);
var newElementsAppended = // answer to the question I'm asking
newElementsAppended.effects("highlight", {}, 2000);

Antwoord 1, autoriteit 100%

Er is een eenvoudigere manier om dit te doen:

$(newHtml).appendTo('#myDiv').effects(...);

Dit verandert de zaken door eerst newHtmlte maken met jQuery(html [, ownerDocument ])en gebruik vervolgens appendTo(target)(let op het “To” bit) om dat toe te voegen aan het einde van #mydiv.

Omdat je nu startmet $(newHtml)is het eindresultaat van appendTo('#myDiv')dat nieuwe stukje html , en de .effects(...)aanroep zal ook op dat nieuwestukje html staan.

Antwoord 2, autoriteit 16%

// wrap it in jQuery, now it's a collection
var $elements = $(someHTML);
// append to the DOM
$("#myDiv").append($elements);
// do stuff, using the initial reference
$elements.effects("highlight", {}, 2000);

Antwoord 3, autoriteit 12%

var newElementsAppended = $(newHtml).appendTo("#myDiv");
newElementsAppended.effects("highlight", {}, 2000);

Antwoord 4, autoriteit 4%

Een kleine herinnering, wanneer elementen dynamisch worden toegevoegd, functies zoals append(), appendTo(), prepend()of prependTo()retourneren een jQuery-object, niet het HTML DOM-element.

DEMO

var container=$("div.container").get(0),
    htmlA="<div class=children>A</div>",
    htmlB="<div class=children>B</div>";
// jQuery object
alert( $(container).append(htmlA) ); // outputs "[object Object]"
// HTML DOM element
alert( $(container).append(htmlB).get(0) ); // outputs "[object HTMLDivElement]"

Antwoord 5

Ik denk dat je zoiets als dit zou kunnen doen:

var $child = $("#parentId").append("<div></div>").children("div:last-child");

De ouder #parentId wordt geretourneerd vanuit de append, dus voeg er een jQuery children-query aan toe om het laatste div-kind ingevoegd te krijgen.

$child is dan de jQuery verpakte onderliggende div die is toegevoegd.