Modo più semplice per ottenere un oggetto jQuery dall'elemento aggiunto

Question

Esiste un modo più semplice / rapido per aggiungere l'elemento usando jQuery append:

Come ottenere l'elemento $ selettori:

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

Ho provato:

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

ma ciò rende $ selettori = $ contenitore

Forse è il modo più veloce / migliore. Sto solo controllando.

Answer 1

Perché non solo:

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

Quindi hai accesso a 'el'.

Answer 2

Questo è il mio modo preferito di farlo:

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

Answer 3

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

Answer 4

Puoi anche creare una nuova funzione jQuery per farlo:

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

e quindi usalo in questo modo:

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

ovviamente se volessi aggiungere più di un elemento:

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

Il vantaggio di approcci come questo è che in seguito puoi aggiungere altro a " addChild " funzione se ti piace. Nota che per entrambi gli esempi sopra, devi aggiungere l'elemento al documento, quindi un esempio completo potrebbe essere:

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