javascript - 显示 XML 文件中的数据

标签 javascript html xml

我正在尝试使用 JavaScript 显示 XML 文件中的数据。我的数据没有显示在网页上,我不确定为什么。

enter image description here

任何帮助/建议将不胜感激。我的代码如下所示。

注意 - 我没有使用 XML 的经验,所以请注意我对它完全陌生。

 <script>
    var xmlData;
    function loadXml () {
        var filename = "CDLibrary.xml";
        var XMLhttp = new XMLHttpRequest();
        XMLhttp.open("GET", filename, true);
        var ok = true;
        try {
            XMLhttp.send();
        }
        catch(err) {
            ok = false;
            alert ("Database not found");
        }
        if (ok) {
            xmlData = XMLhttp.responseXML;
            displayXml(xmlData);
        }
    }
    function displayXml () {
        var CdElements;
        var CdTitle;
        var count;
        CdElements = xmlData.getElementsByTagName("CD");
        for (count = 0; count < CdElements.length; count=count+1) {
            CdTitle = CdElements[count].getElementsByTagName("title");
            document.getElementById("output").innerHTML = document.getElementById("output").innerHTML + CdTitle[0].childNodes[0].nodeValue + "</br>";
        }
    }
 </script>

</head>

<body>
    <div>
        <p id="output">
        </p>
        <p id="buttons">
            <input type="button" id="btnDisplay" value="Display CDs" onclick="loadXml();">
    </div>
</body>

最佳答案

    <html>
    <head><title>Import XML Data</title></head>
    <body>
        <div>
            <p id="output">
            </p>
            <p id="buttons">
                <input type="button" id="btnDisplay" value="Display CDs" onclick="loadXml()">
        </div>
<script>
        var xmlData;
        function loadXml () {
            var filename = "CDLibary.xml";
            var XMLhttp = new XMLHttpRequest();
            XMLhttp.open("GET", filename, true);
            var ok = true;
            try {
                XMLhttp.send();
            }
            catch(err) {
                ok = false;
                alert ("Database not found");
            }
            if (ok) {
                xmlData = XMLhttp.responseXML;
              displayXml(xmlData);
            }
        }
        function displayXml(xmlDataBase) {
            var CdElements;
            var CdTitle;
            var count;
            CdElements = xmlDataBase.getElementsByTagName("CD");
            for (count = 0; count < CdElements.length; count=count+1) {
                CdTitle = CdElements[count].getElementsByTagName("title");
                document.getElementById("output").innerHTML = document.getElementById("output").innerHTML + CdTitle[0].childNodes[0].nodeValue + "</br>";
            }
        }
     </script>
    </body>
    </html>

关于javascript - 显示 XML 文件中的数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40194557/

相关文章:

html - Bootstrap 3 中的谷歌地图全高

android - 考虑添加 android :paddingStart ="25dp" to better support right-to-left layouts Error

javascript - React native - Android - 警告对话框可取消 false 不工作

Javascript 剧透困难

html - 如何在 http 站点的 iframe 中允许 https 内容?

c# - 如何向 Xelement 添加属性

android - 如何设置监听器在抽屉导航中切换?

javascript - 选中的复选框不会更新标签 ASP/JavaScript

Javascript:我如何定位过渡时间?

javascript - 如何在页面重新加载后保持当前选项卡处于事件状态?