XML 基礎(chǔ)教程
XML 用途
XML樹結(jié)構(gòu)
XML 語(yǔ)法規(guī)則
XML元素
XML 屬性
XML 驗(yàn)證
XML 驗(yàn)證器
查看 XML 文件
使用 CSS 顯示 XML
使用 XSLT 顯示 XML
XML JavaScript
XMLHttpRequest 對(duì)象
XML Parser
XML DOM
XML to HTML
XML 應(yīng)用程序
XML 進(jìn)階
XML 命名空間
XML CDATA
XML 編碼
服務(wù)器上的 XML
XML DOM 高級(jí)
XML 注意事項(xiàng)
現(xiàn)實(shí)生活中的 XML
XML 編輯器
XML - E4X
XML 總結(jié) 下一步學(xué)習(xí)什么呢？
?
Ce document utilise Manuel du site Web PHP chinois Libérer
personnages
XML 應(yīng)用程序
本章演示一些基于 XML, HTML, XML DOM 和 JavaScript 構(gòu)建的小型 XML 應(yīng)用程序。
XML 文檔實(shí)例
在本應(yīng)用程序中，我們將使用 "cd_catalog.xml" 文件。
<?xml version="1.0" encoding="utf-8"?> <CATALOG> <CD> <TITLE>Empire Burlesque</TITLE> <ARTIST>Bob Dylan</ARTIST> <COUNTRY>USA</COUNTRY> <COMPANY>Columbia</COMPANY> <PRICE>10.90</PRICE> <YEAR>1985</YEAR> </CD> <CD> <TITLE>Unchain my heart</TITLE> <ARTIST>Joe Cocker</ARTIST> <COUNTRY>USA</COUNTRY> <COMPANY>EMI</COMPANY> <PRICE>8.20</PRICE> <YEAR>1987</YEAR> </CD> </CATALOG>
在 HTML div 元素中顯示第一個(gè) CD
下面的實(shí)例從第一個(gè) CD 元素中獲取 XML 數(shù)據(jù)，然后在 id="showCD" 的 HTML 元素中顯示數(shù)據(jù)。displayCD() 函數(shù)在頁(yè)面加載時(shí)調(diào)用：
實(shí)例
x=xmlDoc.getElementsByTagName("CD");
i=0;
function displayCD()
{
artist=(x[i].getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue);
title=(x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue);
year=(x[i].getElementsByTagName("YEAR")[0].childNodes[0].nodeValue);
txt="Artist: " + artist + "<br />Title: " + title + "<br />Year: "+ year;
document.getElementById("showCD").innerHTML=txt;
}
Artist: Bob Dylan
Title: Empire Burlesque
Year: 1985添加導(dǎo)航腳本
為了向上面的實(shí)例添加導(dǎo)航（功能），需要?jiǎng)?chuàng)建 next() 和 previous() 兩個(gè)函數(shù)：
實(shí)例
function next()
{ // display the next CD, unless you are on the last CD
if (i<x.length-1)
{
i++;
displayCD();
}
}
function previous()
{ // displays the previous CD, unless you are on the first CD
if (i>0)
{
i--;
displayCD();
}
}
當(dāng)點(diǎn)擊 CD 時(shí)顯示專輯信息
最后的實(shí)例展示如何在用戶點(diǎn)擊某個(gè) CD 項(xiàng)目時(shí)顯示專輯信息：
<!DOCTYPE html>
<html>
<head>
<script>
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("GET","cd_catalog.xml",false);
xmlhttp.send();
xmlDoc=xmlhttp.responseXML;
x=xmlDoc.getElementsByTagName("CD");
function displayCDInfo(i)
{
artist=(x[i].getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue);
title=(x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue);
year=(x[i].getElementsByTagName("YEAR")[0].childNodes[0].nodeValue);
country=(x[i].getElementsByTagName("COUNTRY")[0].childNodes[0].nodeValue);
company=(x[i].getElementsByTagName("COMPANY")[0].childNodes[0].nodeValue);
price=(x[i].getElementsByTagName("PRICE")[0].childNodes[0].nodeValue);
txt="Artist: "+artist+"<br>Title: "+title+"<br>Year: "+year+"<br>Country: "+country+"<br>Company: "+company+"<br>Price: "+price ;
document.getElementById("showCD").innerHTML=txt;
}
</script>
</head>
<body>
<div id='showCD'>Click on a CD to display album information.</div><br>
<script>
document.write("<table border='1'>");
for (var i=0;i<x.length;i++)
{
document.write("<tr onclick='displayCDInfo(" + i + ")'>");
document.write("<td>");
document.write(x[i].getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue);
document.write("</td><td>");
document.write(x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue);
document.write("</td></tr>");
}
document.write("</table>");
</script>
</body>
</html>Artist: Dolly Parton
Title: Greatest Hits
Year: 1982
Country: USA
Company: RCA
Price: 9.90
Title: Greatest Hits
Year: 1982
Country: USA
Company: RCA
Price: 9.90
| Bob Dylan | Empire Burlesque |
| Bonnie Tyler | Hide your heart |
| Dolly Parton | Greatest Hits |
| Gary Moore | Still got the blues |
| Eros Ramazzotti | Eros |
| Bee Gees | One night only |
| Dr.Hook | Sylvias Mother |
| Rod Stewart | Maggie May |
| Andrea Bocelli | Romanza |
| Percy Sledge | When a man loves a woman |
| Savage Rose | Black angel |
| Many | 1999 Grammy Nominees |
| Kenny Rogers | For the good times |
| Will Smith | Big Willie style |
| Van Morrison | Tupelo Honey |
| Jorn Hoel | Soulsville |
| Cat Stevens | The very best of |
| Sam Brown | Stop |
| T'Pau | Bridge of Spies |
| Tina Turner | Private Dancer |
| Kim Larsen | Midt om natten |
| Luciano Pavarotti | Pavarotti Gala Concert |
| Otis Redding | The dock of the bay |
| Simply Red | Picture book |
| The Communards | Red |
| Joe Cocker | Unchain my heart |
如需了解更多關(guān)于使用 JavaScript 和 XML DOM 的信息，請(qǐng)?jiān)L問(wèn)我們的 XML DOM 教程。