jQuery“map”将中的数组转换为“dom”元素

jQuery `map` convert arrays in to `dom` element

本文关键字:转换 dom 数组 元素 map jQuery      更新时间:2023-09-26

我正在循环一个数据,并使用jQuery中的map方法创建一个结果。循环完成后,我得到的结果是基于arrayobject,如下所示:

[jQuery.fn.init[1], jQuery.fn.init[1], jQuery.fn.init[1], jQuery.fn.init[1], jQuery.fn.init[1]]

但是我需要基于jQuery的对象(常规dom元素),我如何从map输出中获得它?

完成循环后,我尝试使用get()。但抛出CCD_ 8。获得dom输出的正确方法是什么?

这是我的功能:

this.tbody = this.tableData.map(function (item, index) {
    tr = $('<tr />', { id: item.ID });
    tr.append('<td><input class="selectRow" type="checkbox" /></td>');
    that.headerNames.map(function (label) {
        var newlabel = label.replace(' ', '');
        var labelData = item[newlabel];
        tr.append('<td>' + labelData + '</td>');
    });
    console.log(tr); // [tr#66, jquery: "1.11.1", constructor: function, selector: "", toArray: function, get: function…] //i require all trs became a single output
    return tr;
});
console.log(this.tbody);

尝试从映射处理程序返回dom对象引用,然后将数组传递给jQuery并尝试

var tbody = this.tableData.map(function (item, index) {
    var tr = $('<tr />', {
        id: item.ID
    });
    tr.append('<td><input class="selectRow" type="checkbox" /></td>');
    that.headerNames.map(function (label) {
        var newlabel = label.replace(' ', '');
        var labelData = item[newlabel];
        tr.append('<td>' + labelData + '</td>');
    });
    console.log(tr); // [tr#66, jquery: "1.11.1", constructor: function, selector: "", toArray: function, get: function…] //i require all trs became a single output
    return tr.get(0);
});
this.tbody = $(tbody)

演示:Fiddle,问题