从本地 xml 文件动态创建列表项答案

【问题标题】：Dynamically create list items from local xml file从本地 xml 文件动态创建列表项
【发布时间】：2014-05-06 20:14:36
【问题描述】：

我正在尝试从 XML 文件创建菜单。我要在其中创建菜单的 HTML 文件位于我的主项目文件夹中。此文件夹还包含一个 xml 文件夹，我的 xml 文件 (fruitDB.xml) 位于其中。我知道有几种加载 XML 文件的方法，有些方法只能在线工作。最终菜单用于 HTML5 移动应用程序（不知道这是否有用的信息），使用 Appcelerator 构建。

我已经阅读了一些资料，但我仍然不清楚如何加载 XML 文件。我的标题标签中有以下代码：

<script type="text/javascript">

    function init(){
        var xmlhttp = new XMLHttpRequest();
        xmlhttp.open("GET", "xml/fruitDB.xml", false);
        xmlhttp.setRequestHeader('Content-Type', 'text/xml');
        xmlhttp.send();
        var xmlDoc = xmlhttp.responseXML;
        var Fruits = xmlDoc[];

        alert(Fruits);

        for (var i = 0; i < Fruits.children.length; i++) {
            alert("hi");
            var Fruit = Fruits.children[i];
            var Name = Fruits.getElementsByTagName("name");
            var Thumb = Fruits.getElementsByTagName("image");

            var list = document.getElementById("menuButtons");
            var listEntry = document.createElement("LI");
            listEntry.document.createTextNode(Name);
            list.appendChild(listEntry);
        }
    }

</script>

我在这里尝试做的是打开 init();使用函数，加载 xml 文件，但我不确定提供路径（就像我正在做的那样）是否正确。加载 XML 后，它应该创建新的

在我的 HTML 文件中，并为它们命名（最后是图像），这些名称存储在 xml 文件中，直到 xml 中的所有项目都作为列表项放置。对不起，长句：P。

在 xmlhttp.send();我在控制台中收到以下错误：

XMLHttpRequest cannot load file:///D:/folder/folder/folder/xml/fruitDB.xml. Received an invalid response. Origin 'null' is therefore not allowed access.

这是否意味着使用 XMLHttpRequest 对本地文件不起作用？如果不是，我可以使用什么其他方式来实现我的目标？

【问题讨论】：

标签： javascript xml xmlhttprequest appcelerator createelement

【解决方案1】：

XML 在 Titanium 中没有很好的支持。此外，使用 XML 通常很痛苦..

为什么不改用 JSON 负载/文档！

格式化 JSON，使其成为一个水果对象数组

然后您只需将有效负载解析为从 Web 服务或您的本地文件返回的 javascript 对象，如下所示：

var fruits = JSON.parse(yourHTTPObj.responseData);

现在你可以遍历水果对象并说：

if (fruits[i].type === 'Apple') { //do something };

【讨论】：