jQuery在不覆盖旧HTML的情况下创建多个HTML元素

我想创建一个动态jQuery函数，它计算数组的结果，然后为数组中的每个对象创建一个HTML元素。 该数组由SharePoint API生成。 因此，如果有3个结果/对象，请运行代码3次。如果有2个结果/对象，请运行代码2次

使用下面的代码，它从数组中创建最后一个结果（对象），并覆盖以前生成的结果

我在考虑一段代码，计算对象的数量，然后使用append（）函数添加HTML字段。循环它的次数与对象的次数相同。但我不确定这是最好的方式

jQuery.ajax({
  url: "http://URL/_api/web/webs",
  type: "GET",
  headers: { "accept": "application/json;odata=verbose" },
  success: function (data) {
           console.log(data.d.results);
           var aSites = data.d.results;
           jQuery(aSites).each(function(i,oSite){
               var sTitle = oSite.Title;
               var sURL = oSite.Url;
               console.log(sTitle, sURL);
               jQuery('.wrapper').html(jQuery('<div class="Title"><p>Title:</p><input type="text" name="fname" id="inputTitle"></div><div class="URL"><p>URL:</p><input type="text" name="fname" id="inputURL"></div>'));
               jQuery( "#inputTitle" ).val(sTitle);
               jQuery( "#inputURL" ).val(sURL);
           });
    },
  error: function (error) {
        alert(JSON.stringify(error));
    }
});

jQuery.ajax({
url:“http://URL/_api/web/webs",
键入：“获取”，
标题：{“accept”：“application/json；odata=verbose”}，
成功：功能（数据）{
console.log（data.d.results）；
var aSites=数据和结果；
jQuery（aSites）.each（函数（i，oSite）{
var sTitle=oSite.Title；
var sURL=oSite.Url；
控制台。日志（针，sURL）；
jQuery（'.wrapper'）.html（jQuery（'标题：
URL:
）；
jQuery（“#inputTitle”）.val（sTitle）；
jQuery（“#inputURL”）.val（sURL）；
});
},
错误：函数（错误）{
警报（JSON.stringify（错误））；
}
});

您需要使用

.append（）

，而不是

.html（）

，因此您需要添加而不是替换。您不能每次都使用相同的ID，而是使用一个类

success: function (data) {
   console.log(data.d.results);
   var aSites = data.d.results;
   $('.wrapper').empty();
   jQuery(aSites).each(function(i,oSite){
       var sTitle = oSite.Title;
       var sURL = oSite.Url;
       console.log(sTitle, sURL);
       var newDIV = jQuery('<div class="Title"><p>Title:</p><input type="text" name="fname" class="inputTitle"></div><div class="URL"><p>URL:</p><input type="text" name="fname" class="inputURL"></div>'));
       newDIV.find(".inputTitle" ).val(sTitle);
       newDIV.find(".inputURL" ).val(sURL);
       $('.wrapper').append(newDIV);
   });
},

成功：函数（数据）{
console.log（data.d.results）；
var aSites=数据和结果；
$（'.wrapper'）.empty（）；
jQuery（aSites）.each（函数（i，oSite）{
var sTitle=oSite.Title；
var sURL=oSite.Url；
控制台。日志（针，sURL）；
var newDIV=jQuery（“标题：
URL:
”）；
newDIV.find（“.input”）.val（针）；
newDIV.find（“.inputURL”）.val（sURL）；
$（'.wrapper'）.append（newDIV）；
});
},

使用

.append（）

，而不是

.html（）。你不能在每一个上使用
id=“inputTitle”
和
id=“inputURL”
。谢谢：）我会将对象id放在div中的id后面。这比它应该工作的要多