请，需要帮助循环一个 Javascript 事件答案

【问题标题】：Please, need help looping a Javascript event请，需要帮助循环一个 Javascript 事件
【发布时间】：2012-07-14 21:51:03
【问题描述】：

我编写了一个运行良好的脚本，但我希望添加一个定时循环。我是 Javascript 新手，已经为此苦苦思索了几天，我希望专家能帮助我....

另外，我只需要它在 FireFox 中工作！

此脚本正在从 XML 中提取数据。如果在 XML 中找不到任何内容，则页面将正常显示。如果找到某些内容，它会创建一个弹出 div，显示找到的信息并播放音频文件。

如果通过调用外部 CSS 样式表在 XML 集中找不到任何内容，则弹出窗口只是一个可见性设置为隐藏的 div。如果找到某些内容，则它会引用单独的样式表并播放和音频文件，并将 div 设置可见更改为 true。

我需要以某种方式添加一个循环，以便此脚本每 20-30 秒检查一次 XML 文件，如果发现某些内容，它将显示我隐藏的 DIV 并播放音频警报。这个脚本功能齐全，除了我无法在不重新加载页面的情况下让脚本循环。

我也想将其保留在 <head> 标记中。

    <head>
    <script type="text/javascript">

    if (window.XMLHttpRequest)
      {// code for IE7+, Firefox, Chrome, Opera, Safari
      xmlhttp=new XMLHttpRequest();
      }
    else
      {// code for IE6, IE5
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
    xmlhttp.open("GET","xml/SearchRequest-11988N.xml",false);
    xmlhttp.send();
    xmlDoc=xmlhttp.responseXML;
    
    xtotaltickets=xmlDoc.getElementsByTagName("issue")[0].getAttributeNode("total");
    totaltickets=xtotaltickets.nodeValue;
    ytotaltickets=parseInt(totaltickets);
    
    if (ytotaltickets<1)
    {
    document.write("<link rel='stylesheet' type='text/css' href='notickets.css'>");
    }
    else
    {
      document.write("<link rel='stylesheet' type='text/css' href='newtickets.css'>");
      var audioElement = document.createElement('audio');
      audioElement.setAttribute('src', 'newticket.ogg');
      audioElement.play();
    }
    
    </script>

同样，我只需要在 FireFox 中使用它！

【问题讨论】：

你看过 setInterval 吗？

标签： javascript html xml loops dom-events

【解决方案1】：

将您的代码放入函数中并使用间隔：

<head>
<script type="text/javascript">

function refreshXml() {

    if (window.XMLHttpRequest)
      {// code for IE7+, Firefox, Chrome, Opera, Safari
      xmlhttp=new XMLHttpRequest();
      }
    else
      {// code for IE6, IE5
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
    xmlhttp.open("GET","xml/SearchRequest-11988N.xml",false);
    xmlhttp.send();
    xmlDoc=xmlhttp.responseXML;

    xtotaltickets=xmlDoc.getElementsByTagName("issue")[0].getAttributeNode("total");
    totaltickets=xtotaltickets.nodeValue;
    ytotaltickets=parseInt(totaltickets);

    if (ytotaltickets<1)
    {
    document.write("<link rel='stylesheet' type='text/css' href='notickets.css'>");
    }
    else
    {
      document.write("<link rel='stylesheet' type='text/css' href='newtickets.css'>");
      var audioElement = document.createElement('audio');
      audioElement.setAttribute('src', 'newticket.ogg');
      audioElement.play();
    }
}

setInterval(refreshXml, 20000);

</script>

您需要检查的其他一些事项：

确保可以多次调用该函数而不会创建重复的内容。特别是，您应该在创建它们之前检查您需要的元素是否已经存在。
为确保代码在正确的时间运行，您可能需要监听主体 onload 事件。还可以考虑使用 jQuery，因为它会使代码更易于编写和维护。

【讨论】：

我猜你还应该删除函数开头的样式表
@naveen，是的，我想他需要进行一些重构，这就是为什么我建议在创建元素之前检查它是否存在。
谢谢我成功了！！！我不得不改变一些事情，但你的评论导致了我的解决方案！我没有在页面中解析 XML，而是将其设为外部 html，并使用 iframe 和 css 样式为其提供与我所寻求的相同的美感。然后，我没有更改 CSS，而是使用您修改的代码为 iframe 设置了一个 javascript 可见属性。此外，我不再在 head 标签中运行脚本。它完全按照我的要求工作，感谢您的帮助！！！明天将发布使用的代码。由于我是新成员，stackoverflow 要求我等待 8 小时才能发布答案