Hi, I need some help in making my code more efficient and adding error proofing, as sometimes it freezes and I cannot figure out what is happening.
I tried my best to create what I require but you will probably look at it in disgust, but we all have to start somewhere.

My main aim was to display the contents of an XML file that contains 3 elements of data. DataItem1 should go in the top left of the page, DataItem2 top right and the Image should be displayed below filling the rest of the screen.

The XML will be constantly changing at random intervals, sometimes only 1 XML element will change then other times they all will. Each dataitem on the webpage should only update on the screen if it has changed since it last read the XML file. (as reading on every pass is heavy on resources because of the image)

My code is below, if anyone can offer any advise or maybe edit the code to show me how bad it is I would be very grateful.

Code:
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<html>
<head>
<style>
div.a {
    font-size: 60px;
}
canvas{
  width:93%;
  height:93%;
}
</style>
<table style="width:100%"><tr><th><div class="a"><object id="DataItem1" align="left" ></object></div></th>
<th><div class="a"><object id="Message" align="center" ></object></div></th>
<th><div class="a"><object id="DataItem2" align="right" ></object></div></th></tr></table>
<script type="text/JavaScript">
var refreshInterval = 2000; //in ms
var reloadInterval = 1800000; //in ms 30mins

var img;
var lastDataItem2 = 100000;
function init() {
    var canvas = document.getElementById("canvas");
    var context = canvas.getContext("2d");
    img = new Image();
    img.onload = function() {
  canvas.setAttribute("width", img.width)
          canvas.setAttribute("height", img.height)
        context.drawImage(this, 76, 0);
    };
refresh();
}
function refresh()
{
try //Internet Explorer
{
  var xmlDoc=new ActiveXObject("MSXML.DOMDocument");
xmlDoc.async="false";
var xmlFilePath = "/XMLData.xml";
xmlDoc.load(xmlFilePath );
if (xmlDoc.parseError.errorCode != 0) {
var myErr = xmlDoc.parseError;
location.reload ();
WScript.Echo("You have error " + myErr.reason);
}
}
catch(e)
{
try //Firefox, Mozilla, Opera, etc
{
var xmlhttp = new window.XMLHttpRequest(); 
xmlhttp.open("GET", "/XMLData.xml", false);
xmlhttp.send(null);
var xmlDoc = xmlhttp.responseXML;
if (xmlDoc.getElementsByTagName("DataItem2").length < 1) {
location.reload ();



}
}
catch(e)
{
location.reload ();
return; 
}
}

    var date = new Date();
    var h = date.getHours(); // 0 - 23
    var m = date.getMinutes(); // 0 - 59
    var s = date.getSeconds(); // 0 - 59
    var session = "AM";
    
    if(h == 0){
        h = 12;
    }
    
    if(h > 12){
        h = h - 12;
        session = "PM";
    }
    
    h = (h < 10) ? "0" + h : h;
    m = (m < 10) ? "0" + m : m;
    s = (s < 10) ? "0" + s : s;
    
    var time = h + ":" + m + ":" + s + " " + session;

document.getElementById("DataItem1").innerHTML = xmlDoc.getElementsByTagName("DataItem1")[0].childNodes[0].nodeValue;
document.getElementById("Message").innerHTML = time;
document.getElementById("DataItem2").innerHTML = xmlDoc.getElementsByTagName("DataItem2")[0].childNodes[0].nodeValue;
newDataItem2 = document.getElementById("DataItem2").innerHTML

if (lastDataItem2 != newDataItem2) {
document.getElementById("Image").innerHTML = xmlDoc.getElementsByTagName("Image")[0].childNodes[0].nodeValue;
url = xmlDoc.getElementsByTagName("Image")[0].childNodes[0].nodeValue
img.src = url;
lastDataItem2 = document.getElementById("DataItem2").innerHTML
}

setTimeout("refresh()",refreshInterval);
setTimeout("reload()",reloadInterval);
}

function reload() {
location.reload ()
}

</script>.
<title>Data</title>
</head>
<body onload="JavaScript:init();">
<canvas id="canvas"/>
<object id="Image" ></object>
</body>
</html>
Below is an example of the XML file.

Code:
<Data>
<Dataset>
<DataItem1>0903</DataItem1>
<DataItem2>020</DataItem2>
<Image>/Images/020.jpg</Image>
</Dataset>
</Data>
Any help would be amazing.

Many thanks in advance.