我可以使用 javascript 在 iPad 应用程序中读取 XML 文件吗

Question

我使用 WebView（Woodwing Reader 应用程序）在 iPad 杂志应用程序中包含 HTML 页面。 HTML 页面的所有文件都与该应用程序捆绑在一起。

应用程序的根目录包含一个文件夹 [images]，其中包含应用程序中每个页面的文件夹子目录（即 [page1]、[page2]、[page3] 等）。根目录中还有映射页面布局结构的主 XML 文件。

我正在尝试构建一个 HTML 页面来读取 [magazine.xml] 并通过 Twitter、FB 等共享内容。我能够将 [magazine.xml] 中的数据解析到外部网页（将用于共享 URL），但问题是外部网页无法识别要共享的杂志发行日期。由于每一期的 XML 文件 [magazine.xml] 都有相同的命名约定。

我可以通过 JavaScript 在我的共享应用程序上手动插入发布日期，但我更愿意使其成为一个自动化过程。 XML 文件有一个标记 [issuedate]，列出了发布日期，因此我尝试通过 javascript 读取此标记并将其插入到 URL 字符串中...但到目前为止，没有成功。

下面是我的 javascript 的示例：

var issue = '08-27-2011';

$(function() {
var src = 'http://www.example.com/sections/ipad/'+section+'/?issue='+issue;
$('<iframe " src="' + src + '" width="100%" height="100%" scrolling="auto" frameborder="0"><\/iframe>').appendTo('#iframe');
});

这是 XML 结构的示例：

<?xml version="1.0" encoding="UTF-8"?>
<issue domversion="1.0">
<issuedate>08-19-2011</issuedate>
<items>
<item>
  <id>111</id>
  <category>Story Category</category>
  <title>Story Title</title>
  <description>Description</description>
  <author/>
  <pages>
    <page>
      <horizontalpage>
        <objects>
          <object>
            <id>000111222.1</id>
            <type>webview</type>
            <x>0</x>
            <y>0</y>
            <width>1024</width>
            <height>768</height>
            <link>bundle://images/111/PageID/PageID.html</link>
          </object>
        </objects>
        <pthumb>images/111/PageID_Thumbnail_h.jpg</pthumb>
        <ppreview>images/111/PageID_Preview_h.jpg</ppreview>
      </horizontalpage>
      <verticalpage>
        <objects>
          <object>
            <id>000111222a.1</id>
            <type>activeelement</type>
            <x>0</x>
            <y>0</y>
            <width>768</width>
            <height>1024</height>
            <link>bundle://images/111/PageID/PageID.html</link>
          </object>
        </objects>
         <pthumb>images/111/PageID_Thumbnail_v.jpg</pthumb>
        <ppreview>images/111/PageID_Preview_v.jpg</ppreview>
      </verticalpage>
    </page>

正如我之前提到的，我更愿意自动化收集问题变量的过程。我尝试使用以下代码执行此操作，但无济于事：

 xmlDoc=loadXMLDoc("../../magazine.xml");
 var issue = xmlDoc.getElementsByTagName("issuedate");

$(function() {
var src = 'http://www.example.com/sections/ipad/'+section+'/?issue='+issue;
$('<iframe " src="' + src + '" width="100%" height="100%" scrolling="auto" frameborder="0"><\/iframe>').appendTo('#iframe');
});

如您所见，XML 文件位于距保存 javascript 文件的目录向上两个目录中。我不知道如何进行这项工作...您的帮助将非常感谢。

谢谢， 卡洛斯

------------------------------------------------- ------------------------------------------------------>

更新：

在工作朋友的帮助下，我找到了答案。解决方案实际上比我想象的要容易！我只是将 HTML 页面放在应用程序的根目录中，并使用以下代码调用 XML 文件：

$(function() {
var issue;
$.ajax({
    async: false,
    type: "GET",
    url: "magazine.xml",
    dataType: "xml",
    success: function(xml) {
        issue = $(xml).find('issuedate').text();
    }
});
var src = 'http://www.example.com/ipad/'+section+'/?issue='+issue;
$('<iframe " src="' + src + '" width="100%" height="100%" scrolling="auto" frameborder="0"><\/iframe>').appendTo('#iframe');
});

正如您所看到的，我也能够将“issue”变量传递到 URL 中。

Answer 1

我实际上回答了我自己的问题（在同事的帮助下），所以这里是：

$(function() {
var issue;
$.ajax({
async: false,
type: "GET",
url: "magazine.xml",
dataType: "xml",
success: function(xml) {
    issue = $(xml).find('issuedate').text();
}
});
var src = 'http://www.example.com/ipad/'+section+'/?issue='+issue;
$('<iframe " src="' + src + '" width="100%" height="100%" scrolling="auto" frameborder="0"><\/iframe>').appendTo('#iframe');
});