从附加元素获取jQuery对象的更简单方法

时间:2020-12-10 19:52:02

Is there an easier/quicker way to get the element added using jQuery append:

是否有一种更简单/更快捷的方法可以使用jQuery append添加元素:

How to get the $selectors element:

如何获得$ seltors元素:

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

I tried:

我试着:

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

but that makes $selectors = $container

但这使得$selector = $container

Maybe that's the quickest/best way. Just checking.

也许这是最快的/最好的方法。只是检查。

4 个解决方案

#1


142  

Why not just:

为什么不直接:

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

?

吗?

Then you have access to 'el'.

然后你就可以使用el了。

#2


56  

This is my favourite way of doing it:

这是我最喜欢的方式:

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

#3


5  

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

#4


2  

You could also create a new jQuery function to do it:

您还可以创建一个新的jQuery函数来实现:

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

and then use it like so:

然后像这样使用:

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

of course if you wanted to add more than one item:

当然,如果你想增加一个以上的项目:

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

The advantage of approaches like this is that later on you can add more to the "addChild" function if you like. Note that for both the examples above, you need to add the element to the document, so a full example might be:

这种方法的优点是,如果您愿意,可以在以后添加更多的“addChild”函数。注意,对于上述两个示例,都需要向文档中添加元素,因此完整的示例可能是:

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

#1


142  

Why not just:

为什么不直接:

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

?

吗?

Then you have access to 'el'.

然后你就可以使用el了。

#2


56  

This is my favourite way of doing it:

这是我最喜欢的方式:

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

#3


5  

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

#4


2  

You could also create a new jQuery function to do it:

您还可以创建一个新的jQuery函数来实现:

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

and then use it like so:

然后像这样使用:

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

of course if you wanted to add more than one item:

当然,如果你想增加一个以上的项目:

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

The advantage of approaches like this is that later on you can add more to the "addChild" function if you like. Note that for both the examples above, you need to add the element to the document, so a full example might be:

这种方法的优点是,如果您愿意,可以在以后添加更多的“addChild”函数。注意,对于上述两个示例,都需要向文档中添加元素,因此完整的示例可能是:

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