如何使用 jquery GET 一次获取页面内容但将其拆分并将其插入不同的 div？

Question

嗨，

有一个外部网页，其内容分为 2 个 div。一个是 IDed #mgs，另一个是 #users。我想加载每个 DIV 的内容并将它们插入到我页面上的不同 DIVS 中。我这样做了：

$("#cont1").load("page.php #mgs");
$("#cont2").load("page.php #users");

这可行，但由于外部页面也在我的服务器上，我认为它是一种资源浪费，因为它两次加载相同的页面。我怎样才能只加载一次并将内容分成我的 2 个 div？我尝试过这样的事情：

$.get("page.php", function (data) {
 data = $(data).find('#mgs').html();
 data2 = $(data).find('#users').html();
           
 $("#cont1").empty().append(data);
 $("#cont2").empty().append(data2);
});

但它不会工作。有办法吗？

谢谢。

Answer 1

您使用变量data 的次数过多，当您到达第二个$(data).find() 时，它不再是完整的页面响应。

另外html(string) 将替换所有现有内容，这比组合empty 和append 更简单

试试：

$.get("page.php", function(data) {
  const $page = $(data),
    mgs = $page.find('#mgs').html(),
    users = $page.find('#users').html();

  $("#cont1").html(mgs);
  $("#cont2").html(users);
});