I found an online tutorial on using JavaScript to load a news ticker from XML data. I now want to filter those results by displaying only "message" nodes that contain an "@status" attribute value of "active". I've made a few attempts at it without success. Below is the code that I have, including the solution I tried without success under "filter attempt". If anyone could help me to solve this issue, I'd really appreciate it. Thanks.
xmlticker.xml:
Code:
<?xml version="1.0" encoding="iso-8859-1"?>
<xmlticker>
<pause>1000</pause>
<message url="url1.html" status="active" description="Description #1">Message #1</message>
<message url="url2.html" status="inactive" description="Description #2">Message #2</message>
<message url="url3.html" status="active" description="Description #3">Message #3</message>
<message url="url4.html" status="active" description="Description #4">Message #4</message>
</xmlticker>
ticker.html:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script language="javascript">
/*
DOM XML ticker- © Dynamic Drive (www.dynamicdrive.com)
For full source code, 100's more DHTML scripts, and Terms Of Use, visit http://www.dynamicdrive.com
Credit MUST stay intact
*/
//Declare variables
var tickercontainer = '<div id="container" style="background-color:#FFFFE1;width:150px;height:120px;font:normal 13px Verdana;"></div>';//container for ticker. Modify its STYLE attribute to customize style.
var xmlsource = "xmlticker.xml";//specifies path to xml file
var notWhitespace = /\S/; //regular expression used to match any non-whitespace character
var msglength = "";
var currentmsg = 1;
var themessage = "";
//load xml file
if (window.ActiveXObject) {//then
var xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
}
else if (document.implementation && document.implementation.createDocument) {//then
var xmlDoc= document.implementation.createDocument("","doc",null);
}//end if
if (typeof xmlDoc != "undefined") {//then
//var nodelist As XmlNodeList;
document.write(tickercontainer);
xmlDoc.load(xmlsource);
}//end if
function init_ticker() {//begin function
//Cache "messages" element of xml file
tickerobj = xmlDoc.getElementsByTagName("xmlticker")[0];//ORIGINAL - WORKING
//REMOVE white spaces in XML file. Intended mainly for NS6/Mozilla
for (i=0;i<tickerobj.childNodes.length;i++) {//begin loop
if ((tickerobj.childNodes[i].nodeType == 3) && (!notWhitespace.test(tickerobj.childNodes[i].nodeValue))) {//then
tickerobj.removeChild(tickerobj.childNodes[i]);
i--;
}//end if
}//end loop
document.getElementById("container").innerHTML = "Information follows...";//tickerobj.childNodes[1].firstChild.nodeValue;//this is the container's first value
msglength = tickerobj.childNodes.length;//amount of message nodes
setInterval("rotatemsg()",tickerobj.childNodes[0].firstChild.nodeValue);//set ticker to "pause" node value
}//end function
function rotatemsg() {//begin function
var msgsobj = tickerobj.childNodes[currentmsg];//starting with message 1 (tickerobj.childNodes[1])
if (msgsobj.getAttribute("url") != null) {//then
themessage = '<strong><a href="' + msgsobj.getAttribute("url") + '"';
//Set target
if (msgsobj.getAttribute("target") != null); {//then
themessage += ' target="' + msgsobj.getAttribute("target") + '"';
themessage += '>';
}//end if
themessage += msgsobj.firstChild.nodeValue;//sets title
themessage += '</a>: </strong>';
themessage += msgsobj.getAttribute("description");
themessage += ' <a href="' + msgsobj.getAttribute("url") + '">Learn more >></a>';
//Rotate msg and display it in DIV:
document.getElementById("container").innerHTML = themessage;//applies entire message to div "container"
currentmsg = (currentmsg < msglength - 1)? currentmsg + 1 : 1; //(1 < 4 - 1)? 1 + 1 : 1
themessage = '';
}//end if
}//end function
function fetchxml() {//begin function
if (xmlDoc.readyState == 4) {//then
init_ticker();
}
else {
setTimeout("fetchxml()",10);
}//end if
}//end function
</script>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Test File</title>
</head>
<body>
<script language="javascript">
if (window.ActiveXObject) {//then
fetchxml();
}
else if (typeof xmlDoc != "undefined") {//then
xmlDoc.onload = init_ticker;
}//end if
</script>
</body>
</html>
filter attempt:
Code:
function rotatemsg() {//begin function
var msgsobj = tickerobj.childNodes[currentmsg];//starting with message 1 (tickerobj.childNodes[1])
if (msgsobj.getAttribute("url") != null && msgsobj.getAttribute("status") != "inactive") {//then <<<<<------*****THIS IS WHAT I TRIED*****
themessage = '<strong><a href="' + msgsobj.getAttribute("url") + '"';
//Set target
if (msgsobj.getAttribute("target") != null); {//then
themessage += ' target="' + msgsobj.getAttribute("target") + '"';
themessage += '>';
}//end if
themessage += msgsobj.firstChild.nodeValue;//sets title
themessage += '</a>: </strong>';
themessage += msgsobj.getAttribute("description");
themessage += ' <a href="' + msgsobj.getAttribute("url") + '">Learn more >></a>';
//Rotate msg and display it in DIV:
document.getElementById("container").innerHTML = themessage;//applies entire message to div "container"
currentmsg = (currentmsg < msglength - 1)? currentmsg + 1 : 1; //(1 < 4 - 1)? 1 + 1 : 1
themessage = '';
}//end if
}//end function
JavaScript News Ticker Using XML Data
