如何 select 仅 div 来自另一页 AJAX

Question

我有一个带有帖子的社交媒体，我想用 JS 和 AJAX 展示新内容。我尝试使用 AJAX 重新加载我的页面并将其放在 div 元素中，但现在网站位于此 div 元素中，所以我有两次完整的页面。但是，我只想将 div 元素与 AJAX 一起使用。我的代码如下所示：

var timeout = setTimeout(loadDoc, 2000);

function loadDoc() {
  const xhttp = new XMLHttpRequest();
  xhttp.onload = function() {
    document.getElementById("container").innerHTML = this.responseText;
  }
  xhttp.open("GET", "mywebsite.com");
  xhttp.send();
  timeout = setTimeout(loadDoc, 2000);
}

<div id="container">
post2<br>
post1
</div>

有人可以帮助我吗？

此致，ComputerJoshi

Answer 1

您可以在此处采用两种方法：

有一个明智的API设计

您请求的 URL 返回了一堆您不需要的数据。

更改它（或者创建一个新的 URL 来请求）以便您只获得您想要的数据。

您可以以 HTML 形式保存该数据，但更典型的是以结构化格式呈现它（JSON 很流行）并且然后用它来更新当前页面的DOM。

解析 HTML

将 HTML 的字符串转换为 DOM（例如 DOMParser），然后使用 querySelector 找到 DOM 的部分想要然后复制到当前DOM.

如何 select 仅 div 来自另一页 AJAX

How to select only a div from another page with AJAX

html

javascript

ajax

有一个明智的API设计

解析 HTML