如何按照顺序添加到jQuery对象，而不使用父$('<div>')
如何按照顺序添加到jQuery对象，而不使用父$('<div>')
提问于 2013-10-08 11:59:37
在准备进行一些DOM插入时，我构建了一个jQuery对象数组。例如，选择的选项：
var options = [];
for (...) {
var $option = $('<option>')
...
options.push($option);
}此options数组用作页面上许多选择的模板。所以我想补充一句：
$('.target-select').append(...)我想做到这一点，而不需要将所有选项包装到一个额外的$('<div>')中，然后用children()将它们拿回来。
是否可以按照顺序和不依赖于父元素和children函数来创建一个空的jQuery对象并附加到它的元素中？($.add并不保证对非DOM中的元素进行排序)
回答 2
Stack Overflow用户
回答已采纳
发布于 2013-10-08 13:12:20
您可以使用DocumentFragment创建DOM片段，可以将元素附加到其中，也可以将片段附加到DOM中的任何位置。
例如：
$(document).ready(function(){
var fragment = document.createDocumentFragment();
for (var i = 0;i < 10; i++) {
fragment.appendChild(document.createElement('option'));
}
$('#target').append(fragment);
});Stack Overflow用户
发布于 2013-10-08 12:57:39
下面的代码似乎运行得很好：http://jsfiddle.net/75kVb/5/
var options = [];
for (var i = 0;i < 10; i++) {
var $option = $('<option/>')
$option.text(i);
$('.target-class').append($option);
}你可以做一个空的选择。
var $select = $('<select/>');
var options = [];
for (var i = 0;i < 10; i++) {
var $option = $('<option/>')
$option.text(i);
$select.append($option);
}
$select.appendTo('body'); // not a must, just to prove that it works.为了让他们回来：
console.log($select.find('option'));或者，您只需将数组用作一个简单的数组(而不是<option>数组)，然后就可以使用值：
var options = [];
for (var i = 0; i < 10; i++){
options.push(i);
}
var newOptions = $.map( options, function( item ) { // take every second item
if (item % 2 == 0)
return '<option>' + item + '</option>';
});用于填充选择的示例：$select.html(newOptions);
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/19247115
复制相关文章
相似问题
腾讯云开发者
