上微信头条，C币就是你的又见人月神话 最流行的语言想学就学写博文，传代码，赚C币
JavaScript控制XML文件数据
分类：JavaScript
1.提供好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>…</CATALOG>2.编写HTML页面的显示数据的表格<table border="1px"><tr><td>标题:</td><td id="title"></td></tr><tr><td>艺术家:</td><td id="artist"></td></tr><tr><td>国家:</td><td id="country"></td></tr><tr><td>公司:</td><td id="company"></td></tr><tr><td>价格:</td><td id="price"></td></tr><tr><td>年份:</td><td id="year"></td></tr><tr><td colspan="2"><button onclick="pre()">上一页</button><button onclick="next()">下一页</button></td></tr> </table>
3.编写JavaScript脚本文件
<script type="text/javascript">//加载XMLHttpRequest对象if(window.XMLHttpRequest){xmlhttp = new XMLHttpRequest();}else{xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");}xmlhttp.open("GET", "NewFile.xml", false);//打开链接xmlhttp.send();//发送数据var xmlDoc = xmlhttp.responseXML;//获得xmlDoc的文件var x = xmlDoc.getElementsByTagName("CD");var i = 0;var title = document.getElementById("title");var artist = document.getElementById("artist");var country = document.getElementById("country");var company = document.getElementById("company");var price = document.getElementById("price");var year = document.getElementById("year");//加载数据function displayCD(){title.innerHTML = xmlDoc.getElementsByTagName("TITLE")[i].childNodes[0].nodeValue;artist.innerHTML = xmlDoc.getElementsByTagName("ARTIST")[i].childNodes[0].nodeValue;country.innerHTML = xmlDoc.getElementsByTagName("COUNTRY")[i].childNodes[0].nodeValue;company.innerHTML = xmlDoc.getElementsByTagName("COMPANY")[i].childNodes[0].nodeValue;price.innerHTML = xmlDoc.getElementsByTagName("PRICE")[i].childNodes[0].nodeValue;year.innerHTML = xmlDoc.getElementsByTagName("YEAR")[i].childNodes[0].nodeValue;}//上一页,索引减一,如果小于零就等于零function pre(){i–;if(i < 0){i = 0;}displayCD();}//下一页function next(){i++;displayCD();} </script>4.在页面加载完成后加载数据
<body onload="displayCD()">
上一篇JavaScript计算两个日期之间相差的天数
顶0踩0
主题推荐猜你在找
查看评论
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
核心技术类目
，我要扼住命运的咽喉。
