在jQuery中的几个for循环内动态创建表

我正在尝试使用我拥有的一些数据对象在jQuery中创建一个动态表

我正在努力实现的一个例子就是

我有以下数据对象

这用于将数据库数据（fieldMapping）映射到表上的正确单元格名称

[{
     "input_source_type":"input",
     "field_id":"100786",
     "field_name":"name",
     "input_id":{"List Table":"Label 1 ref"},
     "input_ref":"Label 1 ref"
},
{   
     "input_source_type":"input",
     "field_id":"100787",
     "field_name":"desc",
     "input_id":{"List Table":"Label 2 ref"},
     "input_ref":"Label 2 ref"
},
{   
     "input_source_type":"input",
     "field_id":"100788",
     "field_name":"desc",
     "input_id":{"List Table":"Label 3 ref"},
     "input_ref":"Label 3 ref"
},
{
     "input_source_type":"input",
     "field_id":"100786",
     "field_name":"name",
     "input_id":{"List Table":"Label 4 ref"},
     "input_ref":"Label 4 ref"
},
{   
     "input_source_type":"input",
     "field_id":"100787",
     "field_name":"desc",
     "input_id":{"List Table":"Label 5 ref"},
     "input_ref":"Label 5 ref"
},
{   
     "input_source_type":"input",
     "field_id":"100788",
     "field_name":"desc",
     "input_id":{"List Table":"Label 6 ref"},
     "input_ref":"Label 6 ref"
}]

这是表数据（字段）-实际上每行最多可以有2列。下面是数组列表，每个数组都是一行

[
    ["Label 1 ref"],
    ["Label 2 ref","Label 3 ref"],
    ["Label 4 ref","Label 5 ref"],
    ["Label 6 ref"]
]

每个数据结构都是通过数据库调用以及ID和字段创建的。这些字段通过上面fieldMapping对象上的field_name键链接。 这是数据变量，一个基本的例子是图像

这是我的示例代码

for (var i in data)
{
    if (row instanceof DataStructure)
        {
            for (var i in fields)
            {
                var fieldRef = fields[i];

                for (var f in this.fieldMapping) 
                {
                    if (this.fieldMapping[f].input_id instanceof Object) 
                    {
                        var colspan = 1;
                        if(fieldRef.length == 1)
                            colspan = 2;

                        var fieldName = '';
                        for (var x in this.fieldMapping[f].input_id) 
                        {
                            fieldName = x;
                        }

                        var fName = this.fieldMapping[f].field_name;
                        if (fName == "ID")
                            fName = "id";

                        var cellValue = row.getValue(fName);

                        if (cellValue instanceof DataVariant)
                        {
                            if(colspan == 1)
                            {
                                if(fieldRef[0] && fieldRef[1])
                                {
                                    html += '<tr>';

                                    for (var r in fieldRef)
                                    {
                                        if(fieldRef[r] == this.fieldMapping[f].input_id[fieldName])
                                        {
                                            html += '<td>'+cellValue.getData()+'</td>';
                                        }
                                    }

                                    html += '</tr>';
                                }

                            }
                            else if (colspan == 2)
                            {
                                if (fieldRef == this.fieldMapping[f].input_id[fieldName])
                                {
                                    html += '<tr>';
                                    html += '<td colspan="2">'+cellValue.getData()+'</td>';
                                    html += '</tr>';
                                }
                            }
                        }
                    }
                }
            }
        }
    }
}

for（数据中的变量i）
{
if（数据结构的行实例）
{
for（字段中的变量i）
{
var fieldRef=字段[i]；
for（此.fieldMapping中的变量f）
{
if（this.fieldMapping[f].input_id instanceof Object）
{
var colspan=1；
如果（fieldRef.length==1）
colspan=2；
var fieldName=''；
对于（此.fieldMapping[f]中的变量x），输入\u id）
{
fieldName=x；
}
var fName=this.fieldMapping[f]。字段名称；
如果（fName==“ID”）
fName=“id”；
var cellValue=row.getValue（fName）；
if（数据变量的cellValue实例）
{
if（colspan==1）
{
if（fieldRef[0]&&fieldRef[1]）
{
html+=''；
用于（fieldRef中的var r）
{
if（fieldRef[r]==this.fieldMapping[f].input_id[fieldName]）
{
html+=''+cellValue.getData（）+''；
}
}
html+=''；
}
}
else if（colspan==2）
{
if（fieldRef==this.fieldMapping[f].input_id[fieldName]）
{
html+=''；
html+=''+cellValue.getData（）+''；
html+=''；
}
}
}
}
}
}
}
}
}

我试图得到上述结果，但我一直得到以下（）

标题信息
这是地图信息窗口组件的主体。
54.991987, -1.522710
这是第二个贴图组件的标题
这是地图信息窗口组件的主体。
54.991987, -1.522710

我知道这是因为我使用的循环数量导致了问题。我如何改变这一点以达到预期的结果

如能在正确的方向上提供任何帮助或指导，我们将不胜感激

谢谢

此方法在指定索引处向表中添加新行。如果索引作为-1提供，则该行将添加到最后一个位置

      (4) (Adding the Data Rows)

在数组元素上执行循环，并在HTML表中逐个创建一行。然后在每一行中创建一个动态单元元素，并使用jQuery追加该元素

      (5) (Adding the dynamic Table to the Page)

      note:-You can also append an element to the body but then you won’t be able to set its placement on the page. Using a container such a DIV helps us add the dynamic element to the desired place.[enter image description here][1]

最后，通过使用jQuery将动态创建的表附加到HTML DIV，将其添加到页面中

      (5) (Adding the dynamic Table to the Page)

      note:-You can also append an element to the body but then you won’t be able to set its placement on the page. Using a container such a DIV helps us add the dynamic element to the desired place.[enter image description here][1]

---

这很好，但这不是我想要的。根据数组的长度，我需要创建2列或每行1列。你甚至没有用我的例子

      note:-You can also append an element to the body but then you won’t be able to set its placement on the page. Using a container such a DIV helps us add the dynamic element to the desired place.[enter image description here][1]