为什么这个代码在浏览器上不能一致工作？

<!DOCTYPE html> <html> <head> <title>Test</title> <!-- JQuery code --> <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> <!-- Script which refreshes each element every 5 seconds --> <script> setInterval(reloadElements, 5000); function reloadElements() { $('#refresh').load(location.href+' #refresh'); } </script> </head> <body> <p id="refresh"> This is some paragraph text. <br /> <ul> <li> List item one. </li> <li> List item two. </li> </ul> </p> </body> </html>

这个HTML文件将永远驻留在客户端本地。

我编写这个脚本的全部原因是，我的页面可以自动反映对文件所做的更改（即不需要手动刷新页面）。我有一个C ++应用程序写入这个HTML文件（只改变<p id="refresh">标签的内容）。

我的testing机器运行Windows XP 32位。

Google Chrome上的行为，版本26.0.1410.64 m：

当我使用--allow-file-access-from-files参数运行Chrome并且没有任何命令行参数并使用文本编辑器修改了.html文件时，浏览器中未显示更改。

Internet Explorer上的行为，版本8.0.6001.18702，Mozilla Firefox，版本20.0.1：

仅对段落文本作品进行修改（即反映出的变化）。修改列表元素或在列表之后添加任何内容都不会被反映出来。

JS Bin上的行为：

正如所料，在打开网页并使用文本编辑器修改.html文件后，当5秒的时间间隔过期时，更改将反映在浏览器上。

我目前只需要支持Internet Explorer，Google Chrome和Mozilla Firefox。

为什么会有这种差异？我究竟做错了什么？有没有更好的方法来实现我想要的？

PS：这恰好是我的第一个网页代码。

更新：

我修复了Firefox和Internet Explorer问题，这要感谢斜视的有用build议（请参阅下面的评论）。我基本上把<p>元素的内容放在一个单独的.html文件中，我修改了JQuery加载来加载这个文件。不知道这是如何有所作为。

我想你错过了document.ready

 <script> $(document).ready(function(){ setInterval(reloadElements, 5000); function reloadElements() { $('#refresh').load(location.href+' #refresh'); } }); </script>