刷新网站上一节li的功能

问题描述

我只想对我的网站上的一部分启用刷新。就像仅用于一个表单元格或一个<li>元素一样。有可能吗?

<div id="loading">
  <h1 class="name"> Loading... </h1>
  <ul class="status">
    <li>Status: </li>
    <li>loading state</li>
  </ul>
</div>

我需要刷新“加载状态”。这是我从plc获得的价值。我想每3秒刷新一次。

我试图用JavaScript来实现,但是没有成功。

谢谢您的回答。

解决方法

您可以使用setInterval并在回调函数中进行必要的更改以更新该部分的dom内容。

如果要定期刷新,请使用setInterval;如果只需要刷新一次,请使用setTimeout

setInterval(() => {

  document.getElementById('test').innerHTML = Math.ceil(Math.random() * 200)
},5000)
<div id="loading">
  <h1 class="name" id='test'> Loading... </h1>
  <ul class="status">
    <li>Status: </li>
    <li>loading state</li>
  </ul>
</div>

,

尝试XMLHttpRequest

let xhr = new XMLHttpRequest();

setInterval(() => {

  xhr.open("POST","./Add_address_of_content/",true);
  xhr.onreadystatechange = function () {
    if (xhr.readyState != 4 || xhr.status != 200) return;
    document.getElementById('loadingDivId')=req.responseText;
  };

},3000);
<div id="loading">
  <h1 class="name" id='test'> Loading... </h1>
  <ul class="status">
    <li>Status: </li>
    <li id="loadingDivId">loading state</li>
  </ul>
</div>