如何创建jQuery元素的集合并将它们附加到DOM？

Question

我循环遍历列表,需要为每个列表元素创建一个jQuery Mobile单选按钮.所有的单选按钮都应该放在一个div class="radio-controls"- 一旦完成 - 附加到DOM.

这是我正在尝试的:

    var label = $("<label/>").attr("data-" + $.mobile.ns + "iconpos", "notext");
      barrel = [];

    for (var i = 0; i < myListitems.length; i += 1) {
      var item = myListitems[i];

      barrel.push(
          $("<input type='radio' name='radio-" + this.uuid + "' value='radio-" + this.uuid + "-" + i +"' />" )
            .wrap(label)
            .checkboxradio()
        );
      }
    }

在循环之后,我有一个jQuery数组,我需要追加它.

但是makeArray失败并返回

context is undefined

在jQuery中

 if ( ( context.ownerDocument || context ) !== document ) {

据说是由不包含从文档中选择的元素组成的数组引起的(我的代码仍未添加到DOM中),但是document.createFragement不起作用,因为我认为我无法将jQuery对象添加到片段中.这样做:

 var fragment = document.createDocumentFragment();

 // in my loop
 bullet = $("<input type='radio' name='radio-" + this.uuid + "' value='radio-" + this.uuid + "-" + i +"' />" )
     .wrap(label)
     .checkboxradio()
 fragment.appendChild( bullet );

 // after loop, add to document 
 fragment[o.bulletsPos === "top" ? prependTo : appendTo](el);

返回此错误:

 Value does not implement interface Node.

问题:有没有办法生成jQuery项的集合并将其附加到DOM？当然我可以逐个插入每个项目,但我想创建整个动态并插入一次.

感谢帮助!

Answer 1

能够使用以下示例代码添加此内容:

var collection = [];
var elem;

for (var i = 0; i < 10; i+=1) {
    elem = $("<span />").attr("class","foo-"+i).text("hello");
    collection.push(elem);
}
console.log(collection);
// the "context" error
//$(collection).appendTo(document.body);
$(document.body).append(collection);

小提琴演示:http://jsfiddle.net/558qq/3/