javascript 将 XML 文档（通过 ajax 调用获得）渲染到新窗口
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5581592/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Render XML document (obtained through ajax call) to a new window
提问by nixon
Hi I'm looking for a way to render an XML document, that I retrieve using ajax, to a new browser window.
嗨，我正在寻找一种方法来将我使用 ajax 检索的 XML 文档呈现到新的浏览器窗口。
I am using JQuery's ajax() function to post JSON data to an MVC controller. The controller returns XML as a string.
我正在使用 JQuery 的 ajax() 函数将 JSON 数据发布到 MVC 控制器。控制器以字符串形式返回 XML。
I am using window.open() to create a new window in javascript and set the documents content by calling.
我正在使用 window.open() 在 javascript 中创建一个新窗口并通过调用设置文档内容。
newwindow.document.clear();
newwindow.document.
newwindow.document.write(jqXHR.responseText);
newwindow.document.close();
(Where jqXHR.responseText is the XML returned from the ajax() call.)
（其中 jqXHR.responseText 是从 ajax() 调用返回的 XML。）
The new window opens as expected and if I view source on the page I see my XML. BUT (you knew one was coming) nothing appears in the browser window. Obviously if I save the page source to disk and open the output is rendered as expected.
新窗口按预期打开，如果我在页面上查看源代码，我会看到我的 XML。但是（您知道有人要来了）浏览器窗口中没有任何显示。显然，如果我将页面源文件保存到磁盘并打开，输出将按预期呈现。
Can anyone suggest a solution? Just to re-iterate my main goal is to render an XML document (obtained through ajax call) to a new window.
任何人都可以提出解决方案吗？重申一下，我的主要目标是将 XML 文档（通过 ajax 调用获得）呈现到新窗口。
I should also add that I would like to see the output transformed by an XSLT. My XML has this processing instruction. Many Thanks
我还应该补充一点，我希望看到由 XSLT 转换的输出。我的 XML 有这个处理指令。非常感谢
Edit--------------------------- THE SOLUTION I WENT WITH -------------------------
编辑--------------------------- 我使用的解决方案 ----------------- --------
Thanks for everyone's comments and suggestions.
谢谢大家的意见和建议。
The solution that I ended up going with was to have a form with target="_blank" I then wrote the JSON to the form as a hidden field, and posted it to my controller which returned the XML (constructed from the JSON). When the XML was returned from the response the browser marked it up as expected. I guess this is not an answer to the original question. But Gabby has a solution below.
我最终采用的解决方案是有一个带有 target="_blank" 的表单，然后我将 JSON 作为隐藏字段写入表单，并将其发布到我的控制器，该控制器返回 XML（从 JSON 构建）。当 XML 从响应中返回时，浏览器按预期将其标记。我想这不是原始问题的答案。但是 Gabby 在下面有一个解决方案。
采纳答案by Gabriele Petrioli
The following will work only in FireFoxand Opera, but i think is worth mentioning ..
以下内容仅适用于FireFox和Opera，但我认为值得一提..
window.open('data:text/xml,' + encodeURIComponent( jqXHR.responseText ) );
should work with chrome as well but it seems to treat window.opendifferently than a usual URL.. if you just type the resulting url in chrome it works there as well..
也应该与 chrome 一起使用，但它的处理方式似乎与window.open通常的 URL 不同。
UpdateThis works with all browsers !
更新这适用于所有浏览器！
The thing is that javascript has the ability to tranform xml using xslt.
But not automatically, so we need to find the XML file for the reference to the XSLT file and load that as well. Then we can do the transformation in javascript and pass the resulting html to the new window.
问题是 javascript 有能力使用 xslt 转换 xml。
但不是自动的，所以我们需要找到 XSLT 文件引用的 XML 文件并加载它。然后我们可以在 javascript 中进行转换并将生成的 html 传递到新窗口。
Naturally IE handles thing differently than the rest.
自然地，IE 处理事情的方式与其他的不同。
$.get('xml-file-here.xml',
function(xmlData){
var xml = xmlData;
//extract the stylesheet so we can load it manually
var stylesheet;
for (var i=0;i<xml.childNodes.length;i++){
if ( xml.childNodes[i].nodeName =='xml-stylesheet' )
{
stylesheet = xml.childNodes[i].data;
}
}
var items = stylesheet.split('=');
var xsltFile = items[items.length-1].replace(/"/g,'');
//fetch xslt manually
$.get( xsltFile, function(xsltData){
var xslt = xsltData;
var transformed;
if (! window['XSLTProcessor'])
{
// Trasformation for IE
transformed = xml.transformNode(xslt);
}
else
{
// Transformation for non-IE
var processor = new XSLTProcessor();
processor.importStylesheet(xslt);
var xmldom = processor.transformToDocument(xml);
var serializer = new XMLSerializer();
var transformed = serializer.serializeToString(xmldom.documentElement);
}
var newwindow = window.open();
newwindow.document.open();
newwindow.document.write(transformed);
newwindow.document.close();
});
});
回答by arma
You have to set popup to be Content-type: text/xmland ofc start popup with <?xml version="1.0" encoding="UTF-8"?>
您必须将 popup 设置为Content-type: text/xmland ofc start popup with<?xml version="1.0" encoding="UTF-8"?>
回答by archil
Browser renders html. IE and some others open the xml file with formatting, but that's not the default behaviour of browsers - so you should not rely on it. Better solution for me is to suggest to download file, and the user will decide whenever he wants to save the file or open it. But in case you don't want file download, than you have to generate html from your xml. That's the case when you should make some formatting, add css styles for it to be more user friendly and readable. And to achieve this, the best is to use Xsl Transformationto generate your output html from xml. That would be the most elegant way to generate html directly from xml. But in case you also don't want this, and you really dont care about user experience, you could use some text element (p, span, etc) and write xml not directly into new window, but in this element's text. That way your xml will be displayed as is
浏览器呈现 html。IE 和其他一些使用格式打开 xml 文件，但这不是浏览器的默认行为 - 所以你不应该依赖它。对我来说更好的解决方案是建议下载文件，用户将决定何时保存或打开文件。但是，如果您不想下载文件，则必须从 xml 生成 html。就是这种情况，您应该进行一些格式化，添加 css 样式以使其更加用户友好和可读。而要实现这一点，最好是使用Xsl Transformation从 xml 生成您的输出 html。这将是直接从 xml 生成 html 的最优雅的方式。但是，如果您也不想要这个，并且您真的不关心用户体验，您可以使用一些文本元素（p、span 等）并且不直接将 xml 写入新窗口，而是在该元素的文本中写入。这样您的 xml 将按原样显示
回答by TJHeuvel
You might lose a buzzword, but why dont you just open a window that points to the controller's URL?
您可能会丢失一个流行语，但为什么不直接打开一个指向控制器 URL 的窗口呢？
回答by Diodeus - James MacFarlane
Write the XML into a textarea. Style the textarea using CSS.
将 XML 写入文本区域。使用 CSS 为 textarea 设置样式。
