Einfachere Möglichkeit, ein jQuery-Objekt aus einem angehängten Element zu erhalten

Question

Gibt es eine einfachere/schnellere Möglichkeit, das Element mit jQuery append hinzugefügt zu bekommen:

Wie man das Element $selectors erhält:

$container.append('<div class="selectors"></div>');
var $selectors = $('.selectors', $container);

Ich habe es versucht:

var $selectors = $container.append('<div class="selectors"></div>');

aber das macht $selectors = $container

Vielleicht ist das der schnellste/beste Weg. Nur zur Kontrolle.

Answer 1

Warum nicht einfach:

var el = $('<div class="selectors"></div>');
$container.append(el);

?

Dann haben Sie Zugang zu 'el'.

Answer 2

Das ist meine Lieblingsmethode:

var $selectors = $('<div class="selectors"></div>').appendTo(container);

Answer 3

$selectors = $('<div/>').addClass('selectors').appendTo($container);

Answer 4

Sie können dafür auch eine neue jQuery-Funktion erstellen:

jQuery.fn.addChild = function(html) 
{                               
    var target  = $(this[0])                            
    var child = $(html);                                                      
    child.appendTo(target);                                                   
    return child;                                                             
};  

und verwenden Sie es dann so:

$('<ul>').addChild('<li>hi</li>');

natürlich, wenn Sie mehr als einen Artikel hinzufügen möchten:

var list = $('<ul>');
list.addChild('<li>item 1</li>');
list.addChild('<li>item 2</li>');

Der Vorteil eines solchen Ansatzes ist, dass Sie der Funktion "addChild" später weitere Elemente hinzufügen können, wenn Sie möchten. Beachten Sie, dass Sie für die beiden obigen Beispiele das Element zum Dokument hinzufügen müssen, ein vollständiges Beispiel könnte also lauten:

$('body').addChild('<ul>').addChild('<li>hi</li>');