如何使 div 自动刷新

有时候，我们希望一个 div 元素可以自动地刷新，特别是在需要动态或实时更新内容时。这可以通过 JavaScript 来完成。以下是一些方法：

1. setInterval() 方法

可以使用 setInterval() 方法来定期刷新 div 元素中的内容。该方法接受两个参数：第一个是要执行的代码或函数，第二个是定时器的时间间隔（以毫秒为单位）。

例如，以下代码将每秒钟更新一个 div 元素中的文本：

const divElement = document.getElementById('myDiv');
const contentArray = ['Content 1', 'Content 2', 'Content 3'];
let i = 0;

setInterval(() => {
  divElement.innerHTML = contentArray[i];
  i = (i + 1) % contentArray.length;
}, 1000);

在上面的代码中，我们首先获取了一个 id 为 myDiv 的 div 元素，然后定义了一个字符串数组 contentArray，其中包含我们想要更新的内容。然后我们设置了一个计数器 i，并使用 setInterval() 方法定期更新 divElement.innerHTML。每次更新时，我们使用计数器取出下一个内容。

2. jQuery 的 load() 方法

如果你在项目中使用了 jQuery，那么可以使用其中的 load() 方法来实现自动更新 div 内容。

例如，以下代码将每隔一秒钟从服务器上更新一个 div 元素中的内容：

const divElement = $('#myDiv');
setInterval(() => {
  divElement.load('ajax/content.html');
}, 1000);

在上面的代码中，我们首先使用 $() 函数获取 myDiv 元素，然后使用 setInterval() 方法定期调用 load() 方法。该方法从 ajax/content.html 文件中获取内容，并将其添加到 div 元素中。

3. Ajax 请求

你也可以使用 Ajax 请求来动态地加载和更新 div 内容。以下是一个基本示例：

function updateDiv() {
  const xhr = new XMLHttpRequest();

  xhr.onreadystatechange = function() {
    if (this.readyState === 4 && this.status === 200) {
      document.getElementById('myDiv').innerHTML = this.responseText;
    }
  };
  xhr.open('GET', 'myContent.html', true);
  xhr.send();
}

setInterval(updateDiv, 1000);

在上面的代码中，我们使用了 XMLHttpRequest 对象来发起一个 GET 请求，并在请求成功时更新 div 内容。然后我们将 updateDiv() 函数传递给 setInterval() 方法，以定期更新内容。

总之，以上是一些方法可以使 div 自动刷新。你可以根据需要选择其中任何一种。