Question

我正在尝试遍历页面中的超链接列表，从每个超链接页面加载html内容并将其附加到当前页面中的div。但结果是只有一个页面的html内容被加载和追加到div.How我能达到预期的效果。

以下是我尝试使用以下内容实现结果的代码段：

$('th[scope="row"]').children("a").each(function(){
    var url = $(this).attr("href");
    var tempDiv = $('<div id=\"loadedDiv\"></div>').appendTo('.someClass');
    var fullUrl = url+' '+'.tabClass';
    $("#loadedDiv").load(fullUrl);
});

Answer 1

你应该使用loadedDiv不是id的类，因为id必须是唯一的。

事实上，为了使代码更快更简洁，需要进行一些调整

$('th[scope="row"]>a').each(function(){
    $('<div class=\"loadedDiv\"></div>').load(this.href + ' .tabClass').appendTo('.someClass');
});

Answer 2

$('<div id=\"loadedDiv\"></div>')

在.each循环中的

不是一个好主意。

你会得到一些具有相同身份的div。

difference between id and class

Answer 3

您正在每次迭代时使用相同的id，loadedDiv创建新元素。这是无效的HTML，因为id属性必须是唯一的。此外，$("#loadedDiv")将始终获取相同的元素，通常是#loadedDiv的第一次出现，并且您最终会一遍又一遍地重写相同div的内容。

如果使用链创建，追加和加载内容，则无需为新创建的元素指定id属性。

$('th[scope="row"]').children("a").each(function(){
    var url = $(this).attr("href");
    var fullUrl = url + ' .tabClass';
    $('<div/>').appendTo('.someClass').load(fullUrl);
});

Answer 4

请勿使用加载，请改用$ .get：

$.get(fullUrl, function(response) {

    $("#loadedDiv").append(response);

});

在jQuery中使用.each（）内的.load（）方法不返回所有html内容

4 个答案: