Hi there!
I have a page with different products and by clicking a button I am opening a new window with more details on each product. In the new window I pass a string variable which then opens the specific xml file for the product. I have an image tag with the image’s url
(<IMAGE><src>images/detailed/white/darkspots.jpg</src></IMAGE>)
in my xml and need to access it to load the picture.
My code in the new window is the following and it works with the text of the xml but haven’t figured out how to change the image source. Any help would be really appreciated. By the way, does anyone know how to make the XML parser work for Safari? Thanks a lot
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=“http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=“Content-Type” content=“text/html; charset=UTF-8” />
<script type=“text/javascript”>
var product = window.opener.message;
document.title = product;
var imgName = ‘"’+“images/detailed/” + product + “.jpg”+’"’;
function parseXML()
{
try //Internet Explorer
{
xmlDoc=new ActiveXObject(“Microsoft.XMLDOM”);
}
catch(e)
{
try //Firefox, Mozilla, Opera, etc.
{
xmlDoc=document.implementation.createDocument("","",null);
}
catch(e)
{
alert(e.message);
return;
}
}
xmlDoc.async=false;
var xmlStr = “xml/” + product + “.xml”;
xmlDoc.load(xmlStr);
document.getElementById(“name”).innerHTML=xmlDoc.getElementsByTagName(“NAME”)[0].childNodes[0].nodeValue;
document.getElementById(“pack”).innerHTML=xmlDoc.getElementsByTagName(“PACK”)[0].childNodes[0].nodeValue;
document.getElementById(“des”).innerHTML=xmlDoc.getElementsByTagName(“DES”)[0].childNodes[0].nodeValue;
document.getElementById(“incr”).innerHTML=xmlDoc.getElementsByTagName(“INCR”)[0].childNodes[0].nodeValue;
document.getElementById(“use”).innerHTML=xmlDoc.getElementsByTagName(“USE”)[0].childNodes[0].nodeValue;
}
</script>
<title></title>
</head>
<body onload=“parseXML()”>
<div id=“Content”>
<h1 id=“name”></h1>
<div id=“line” style=“background-image:url(‘images/line.gif’);”>lala</div>
[COLOR=“Red”] <img src="" id=“myPic”/>[/COLOR]
<p class=“grey” id=“pack”></p>
<div id=“line” style=“background-image:url(‘images/line.gif’);”>lala</div>
<p class=“dark” id=“des”></p>
<div id=“line” style=“background-image:url(‘images/line.gif’);”>lala</div>
<p class=“grey” font-size:“14px”>Main Incredients</p>
<p class=“grey” id=“incr”></p>
<p class=“grey” font-size:“14px”>Use</p>
<p class=“grey” id=“use”></p>
</div>
</body>
</html>
