如何自动更新 html 内容？答案

【问题标题】：How to automate the update of html content?如何自动更新 html 内容？
【发布时间】：2015-10-31 07:53:27
【问题描述】：

我正在尝试创建一个类似但用于显示数据库内容的 FB 新闻提要。我的代码已经读取了表格的行数，但它需要在更新 html 的内容之前刷新页面。

这是我的代码：

我的 html 文件的一部分：

<section id="reportcontent"></section>
<script>
    (function refreshNews()
    {
        $("#reportcontent").load("php/ajax.php");
    })();
    setInterval('refreshNews()',1000); 
</script>

ajax.php 的内容

<?php 
    require("database.php");

    $sql = "SELECT * FROM report";

    $res = odbc_exec($conn,$sql);

    while($feedItem = odbc_fetch_array($res))
    {
        echo "hello! <br>";
    }
?>

如您所见，我的表格的每一行都会回显一个 hello 文本。但为了查看新的行数，我需要刷新页面。感谢您的帮助！

【问题讨论】：

标签： javascript php jquery html ajax

【解决方案1】：

这应该可以。您将函数名称作为字符串传递给 setInterval，方法是将其包装在 '' 中。它应该只是调用诸如

之类的函数

setInterval('refreshNews',1000);

也不确定这是否只是一个示例，但 php 代码不会为表生成行。
只是一个换行符。

当我们在做的时候。在 Ajax 调用中使用间隔是一种不好的做法。原因是请求可能需要比间隔时间更长的时间，并且您最终会同时运行许多呼叫。在 AJAX.load() 的回调函数中使用 setTimeout 代替

function refreshNews()
    {
       $("#reportcontent").load("php/ajax.php", function(){setTimeout(refreshNews, 1000);});
        
    }();


window.onload= function(){
    refreshNews(); 
  }

&lt;section id="reportcontent"&gt;&lt;/section&gt;

【讨论】：

没有错误它只是它不会自动更新我仍然需要刷新:)
如果我将该部分放在脚本之后，它不会显示问候文本。
您应该始终尝试将脚本放在文档的头部，这意味着您的脚本将位于正文之前。这将导致在 DOM 正确加载之前执行未由事件触发的任何内容。因此，您需要调用 window.onload=function(){ } 中的所有内容
参见上面的编辑代码。还要指出 setInterval 在使用 AJAX 时是一个糟糕的选择。原因是 AJAX 调用可能需要比完成时间更长的时间，并且您最终会执行多个 AJAX 实例。尝试改用 setTimeout。
@PC3TJ 您使用超时的代码既不等待ajax请求完成，它应该是例如：$("#reportcontent").load("php/ajax.php", function(){setTimeout(refreshNews, 1000);});