Отображение XML-строки на странице HTML

Question

Из моего бэкэнда я получаю строку, содержащую некоторые данные XML. Когда я отображаю это (теперь только с @ Model.XM) L, я вижу хорошую длинную строку, содержащую данные XML. Есть ли способ отформатировать это как древовидную структуру? Как с плагином JQuery или что-то? Я попробовал Google, но не смог его найти.

На странице есть и другие данные, это не только данные xml.

Answer 1

Все, что вам нужно, это рекурсивный цикл, который превратит дочерние узлы документа XML в элементы списка HTML. Попробуйте что-то вроде этого (не проверено):

var html = '<ul><li>' + xml.documentElement.nodeName + '</li>';
var html += displayTree(xml);
var html += '</ul>';

function displayTree(xml) {
    var str = '';
    if ($(xml).children().length) {
        str += '<ul>';
        $(xml).children().each(function() {
            str += '<li>' + this.nodeName + '</li>';
        });
        str += '</ul>';
        str += displayTree(xml.childNodes);
    });
    return str;
}

Answer 2

Вы можете использовать XSLT.

<xsl:stylesheet version="1.0"
 xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
 <xsl:output omit-xml-declaration="yes" indent="yes"/>

    <xsl:template match="node()|@*">
      <xsl:copy>
        <xsl:apply-templates select="node()|@*"/>
      </xsl:copy>
    </xsl:template>
</xsl:stylesheet>

Ключ -

<xsl:output indent="yes"/>

Если вы примените вышеупомянутое преобразование к вашему XML, оно получится с правильными отступами.Подробнее: http://www.w3.org/TR/xslt#copying