Refresh body tag if file input changes
<p>I have a local non server webpage called DisplayItems.html which pulls a list from another webpage called items.html. I currently had it set up where DisplayItems refreshes its body every x seconds in case items.html got updated. I am trying to lean towards checking if the input has changed every few seconds. If so, refresh the body of DisplayItems, if not, don't refresh. How could I go along of doing this? </p>

<p>DisplayItems.html</p>

<pre><code>&lt;!DOCTYPE html&gt;
&lt;html&gt;
&lt;head&gt;
&lt;meta http-equiv="X-UA-Compatible" content="IE=Edge"&gt;
&lt;link rel="stylesheet" type="text/css" href="Scroll.css"&gt;
&lt;script src="jquery1.min.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript" src="jquery.marquee.min.js"&gt;&lt;/script&gt;
&lt;script src="jquery-1.12.4.min.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript"&gt;
var jQuery_1_12_4 = $.noConflict(true);
var currentvar;
var oldvar = jQuery_1_12_4('#text').load("items.html"); 
&lt;!--
function Refresh() {
setTimeout("location.reload(true);");
}
window.setInterval(function Checkforchange(){
  currentvar = jQuery_1_12_4('#text').load("items.html"); 
  if (currentvar != oldvar)
  currentvar = oldvar;
  Refresh();
}, 5000);
//   --&gt;
&lt;/script&gt; 
&lt;/head&gt;
&lt;body  onload="JavaScript:Refresh();"&gt;

&lt;ul class='marquee' id="text"&gt;
&lt;/ul&gt;

&lt;script type="text/javascript"&gt;
jQuery_1_12_4('#text').load("items.html");
&lt;/script&gt;   
&lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p>Items.html</p>

<pre><code>&lt;li&gt;new item1&lt;/li&gt;
&lt;li&gt;senario2&lt;/li&gt;
&lt;li&gt;senario3&lt;/li&gt;
</code></pre>