반응형
xml문서를 자바스크립트로 읽어와서 표현해야 할 경우

읽어올 xml의 내용
<?xml version="1.0"?>
<xmlticker>
<pause>3000</pause>
<message>This is message #1</message>
<message url="http://www.cnn.com">This is a link to CNN.com</message>
<message url="http://yahoo.com" target="_new">This is a link to Yahoo</message>
<message>This is message #3</message>
<message>This is message #4</message>
<message>This is message #5</message>
</xmlticker>

자바스크립트로 읽어오는 부분

<script language="JavaScript1.2">

/*
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
*/

//Container for ticker. Modify its STYLE attribute to customize style:
var tickercontainer='<div id="container"style="background-color:#FFFFE1;width:150px;height:120px;font:normal13px Verdana;"></div>'

//Specify path to xml file
var xmlsource="ticker.xml"

////No need to edit beyond here////////////
//load xml file
if (window.ActiveXObject)
var xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
else if (document.implementation && document.implementation.createDocument)
var xmlDoc= document.implementation.createDocument("","doc",null);
if (typeof xmlDoc!="undefined"){
document.write(tickercontainer)
xmlDoc.load(xmlsource)
}

//Regular expression used to match any non-whitespace character
var notWhitespace = /\S/

function init_ticker(){
//Cache "messages" element of xml file
tickerobj=xmlDoc.getElementsByTagName("xmlticker")[0]

//REMOVE white spaces in XML file. Intended mainly for NS6/Mozilla
for (i=0;i<tickerobj.childNodes.length;i++){
if ((tickerobj.childNodes[i].nodeType == 3)&&(!notWhitespace.test(tickerobj.childNodes[i].nodeValue))) {
tickerobj.removeChild(tickerobj.childNodes[i])
i--
}
}
document.getElementById("container").innerHTML=tickerobj.childNodes[1].firstChild.nodeValue
msglength=tickerobj.childNodes.length
currentmsg=2
themessage=''
setInterval("rotatemsg()",tickerobj.childNodes[0].firstChild.nodeValue)
}

function rotatemsg(){
var msgsobj=tickerobj.childNodes[currentmsg]
if (msgsobj.getAttribute("url")!=null){
themessage='<a href="'+msgsobj.getAttribute("url")+'"'
if (msgsobj.getAttribute("target")!=null)
themessage+=' target="'+msgsobj.getAttribute("target")+'"'
themessage+='>'
}
themessage+=msgsobj.firstChild.nodeValue
if (msgsobj.getAttribute("url")!=null)
themessage+='</a>'

//Rotate msg and display it in DIV:
document.getElementById("container").innerHTML=themessage
currentmsg=(currentmsg<msglength-1)? currentmsg+1 : 1
themessage=''
}

function fetchxml(){
if (xmlDoc.readyState==4)
init_ticker()
else
setTimeout("fetchxml()",10)
}

if (window.ActiveXObject)
fetchxml()
else if (typeof xmlDoc!="undefined")
xmlDoc.onload=init_ticker

</script>



반응형

'삽질로그' 카테고리의 다른 글

웹폰트 적용시키기  (0) 2009.11.27
회사 svn, trac 설정  (0) 2009.11.25
오랜만에 find 쓸일이 생겨서..  (0) 2009.11.23
HTML 테이블 CSS  (0) 2009.11.04
UI Component  (0) 2009.10.07

+ Recent posts