jQuery AJAX XML具有相同的结构

我不熟悉使用XML并且正在测试它的项目（我们不能使用JSON，我们已经有了必须使用的现有XML）。jQuery AJAX XML具有相同的结构

我的问题是，我希望从XML显示的结构完全相同的数据追加数据。

<?xml version="1.0" encoding="UTF-8" ?> 
<?xml-stylesheet type="text/xsl" href="../xsl/html.xsl" ?> 
<htmldoc> 
    <heading> 
     Odyssey Heading HTML Test in XML. 
    </heading> 
    <para> 
     Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod 
     tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, 
     quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo 
     consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse 
     cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non 
     proident, sunt in culpa qui officia deserunt mollit anim id est laborum. 
    </para> 
    <data>GBF79759</data> 
    <para> 
     Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod 
     tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, 
     quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo 
     consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse 
     cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non 
     proident, sunt in culpa qui officia deserunt mollit anim id est laborum. 
    </para> 
</htmldoc>

这是一个简单的例子（尽管现有的XML复杂得多）某些XML标记，我用这个作为例子，因为我有一个分隔标记的组合（<para>'s & <data>是这里最好的例子）。

我一直在网上查看，每个人都以非动态方式追加数据，选取元素并追加它们，我想要做的是将XML文档中的每个标记都标记为HTML元素，然后附加一切。我也想知道这是XSL涵盖的东西吗？由于我对XML/XSL没有太多的知识，因此不胜感激。

这是我目前的测试JS的例子（非动态的方式）：

$.ajax({ 
    url: 'xml/' + data + '.xml', 
    type: 'GET', 
    dataType: 'xml' 
}).done(function(xml) { 
    console.log("success"); 
    $(xml).find('htmldoc').each(function() { 
     var heading = $(this).find('heading').text(), 
      para = $(this).find('para').text(); 

     $('#main > .content-wrapper > .container').append(
      // XML Structure 
      $('<h3>' + heading + '</h3>'), $('<p>' + para + '</p>') 
     ); 
    }); 
}).fail(function(jqXHR, textStatus, errorThrown) { 
    console.log("error", jqXHR, textStatus, errorThrown); 
}).always(function() { 
    console.log("complete"); 
});

来源

2016-01-11 Joe Methven

你的意思是你想直接追加所有的XML从里面' '元素到你的页面？ –

你好，这正是我想要的，从字面上追加确切的结构，而不是樱桃挑选它的某些部分。 –

XSLT在这方面做得很好，您可以为每个输入元素类型创建一个模板，创建相应的HTML结果元素，请参阅http://xsltransform.net/6r5Gh3x一个简单的例子，它很容易适应您可以添加更多的模板，只需要确保使用''继续递归处理。 –

$($.parseXML(xml)).find('htmldoc').each(function() { 
    var heading = $(this).find('heading').text(), 
     para = $(this).find('para').text(); 

    $('#main > .content-wrapper > .container').append(
     // XML Structure 
     $('<h3>'+heading+'</h3>'), $('<p>'+para+'</p>') 
    ); 
});

Fiddle

来源

2016-01-11 08:46:17 dann

对不起，你能总结一下，这与我目前的版本有何不同？在你的小提琴上，它仍然附加指定的内容，而不是XML中的所有内容，而不是“樱桃树”。 –

jQuery AJAX XML具有相同的结构

回答

相关问题