javascript - 使用jquery获取xml文件的外部xml结构到字符串

Question

我不知道仅使用 javascript/jquery 是否可行。我有许多 xml 文件，通常使用 xpath 读取和显示，但 xml 文件是使用如下 HTML 元素构建的:

 <?xml version="1.0" encoding="UTF-8"?>
 <catalog>
 <outcome>
    <title>1.1</title>
    <section>
    <p>some text as an intro:
      <ul>
        <li>part of list</li>
        <li>part of list</li>
      </ul>
    </p>
    <p>more text</p>
    </section>
</outcome>

<outcome>
 <title>1.2</title>
 <section>
    <p>some text as an intro:
      <ul>
        <li>part of list</li>
        <li>part of list</li>
      </ul>
    </p>
    <p>more text</p>
    </section>
</outcome>
</catalog>

我想显示选择元素的所有子元素和后代。使用 javascript，我知道如何加载 xml 并选择我需要的元素，并且我知道如何循环节点，但是是否有可能只获取节点及其后代作为字符串？然后我可以只获取字符串并附加一个 div，如 element.html("string")。我会让我的 css 根据需要设置元素的样式。 这可以用 JavaScript 实现吗？我知道 xsl 可以作为整个页面来完成此操作，但我只需要大型 xml 的一小部分。

Answer 1

可以使用 jQuery 将其视为 html 来相当简单地完成此操作

$(function() {
  $.get('data.xml', function(xml) {
    $(xml).find('outcome').each(function() {
      $('body').append($(this).html());
    });
  }, 'html');
});

如果您需要在插入新的 html 之前对其进行操作(例如添加类等)，这也是微不足道的失败

DEMO