web-dev-qa-db-ja.com

追加された要素からjQueryオブジェクトを取得する簡単な方法

JQuery appendを使用して要素を追加する簡単な方法がありますか?

$ selectors要素を取得する方法:

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

私は試した:

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

しかし、それは$ selectors = $ containerになります

たぶんそれが最速/最良の方法です。チェックしてるだけ。

78
slolife

なぜだけではありません:

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

その後、「el」にアクセスできます。

153
cletus

これは私のお気に入りの方法です:

var $selectors = $('<div class="selectors"></div>').appendTo(container);
60
Magnar
$selectors = $('<div/>').addClass('selectors').appendTo($container);
5
hobbs

また、新しいjQuery関数を作成して実行することもできます。

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

そして次のように使用します:

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

もちろん、複数のアイテムを追加したい場合:

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

このようなアプローチの利点は、後で必要に応じて「addChild」関数にさらに追加できることです。上記の両方の例では、ドキュメントに要素を追加する必要があるため、完全な例は次のようになることに注意してください。

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