如果 HTML 文件已更新，则执行 JavaScript 2答案

【问题标题】：Execute JavaScript if HTML file has been updated 2如果 HTML 文件已更新，则执行 JavaScript 2
【发布时间】：2013-11-25 14:00:07
【问题描述】：

来自this page 我得到了一个很好的答案，见下面的代码。我遇到了一个问题。

此脚本正在检查自身。代码在 index.html 中，它会检查 index.html 是否有变化。如果有变化，它应该刷新自己。这一切都有效，但它保持在相同的状态。

因此，如果您更改文件一次，它将循环显示“站点已被修改”并刷新。有人知道如何解决这个问题吗？

<html>
  <head>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
    <script type="text/javascript">
      var checkUrl="index.html";
      var firstCheck = false;
      window.setInterval("checkForUpdate()", 1000);

      function checkForUpdate() {
          $.ajax(checkUrl, {
              ifModified : true,
              type : 'HEAD', 

              success : function (response) {
                  if(firstCheck === false) {
                      firstCheck = true;
                      return;
                  }
                  $('#output').html('the site has been modified');
              }
          }); 
      }    
   </script> 
  </head>
  <body>
    <div id="output">Not Modified</div>
  </body>
</html>

【问题讨论】：

如果您尝试使用GET 或POST 而不是HEAD 作为您的请求类型会发生什么？ api.jquery.com/jQuery.ajax/#jQuery-ajax-settings 暗示 HEAD 可能不被完全支持

标签： javascript ajax jquery http-headers

【解决方案1】：

您的代码源承认它不起作用并提供替代解决方案：

var checkUrl="test.txt";
window.setInterval("checkForUpdate()", 1000);
var pageLoad = new Date().getTime();

function checkForUpdate() {
    $.ajax(checkUrl, {
        type : 'HEAD',
        success : function (response, status, xhr) {
            if(firstCheck === false) {
                firstCheck = true;
                return;
            }
            // if the server omits the 'Last-Modified' header
            // the following line will return 0. meaning that
            // has not updated. you may refine this behaviour...
            var lastModified = new Date(xhr.getResponseHeader('Last-Modified'))
                .getTime();
            if(lastModified > pageLoad) {
                $('#output').html('the site has been modified');
            }
        }
    }); 
}

【讨论】：

如果我删除if(firstCheck === false) { firstCheck = true; return; }似乎可以工作