將格式不正確的XML文檔轉換爲HTML無序列表

我正在研究一個需要我解析XML樹不太好的XML樹的項目。我需要從XML中定義UL結構，但問題是所有節點都具有不同屬性的相同名稱。我正在使用jQuery ajax函數來調用這個XML文件，並在成功時返回它。這是我的難題：將格式不正確的XML文檔轉換爲HTML無序列表

>  <class name="Juice"> 
>  <class name="OJ"> 
>   <class name="Low Sugar" /> 
>   <class name="Some Pulp" /> 
>  </class> 
>  <class name="Apple" /> 
>  <class name="Grape" /> 
>  </class>

正如你所看到的節點名稱很難將其轉換爲統一列表。我試圖讓這個遞歸，看起來像這樣：

<ul> 
    <li>Juice 
     <ul> 
      <li>OJ 
       <ul> 
        <li>Low Sugar</li> 
        <li>Some Pulp</li> 
       </ul> 
      </li> 
      <li>Apple</li> 
      <li>Grape</li> 
     </ul> 
    </li> 
</ul>

我的Ajax調用：

$.ajax({ 
    type: "GET", 
    url: "nav.xml", 
    dataType: "xml", 
    success: function (xml) { 
     xmlParser(xml); 
    } 
});

我XMLPARSER功能：

function xmlParser(xml) { 

    $(xml).find("class class").each(function() { 

     var cname = $(this).attr("name"); 

     if ($(this).children.length > 0) { 

      $("#nav .categories").append("<li id='" + cname + "'><a href='#'>" + cname + "</a></li>"); 
      $(xml).find("[name='" + cname + "']").children().each(function() { 
       var cname1 = $(this).attr("name"); 
       $("#" + cname).append("<ul></ul>"); 
       $("#" + cname + " ul").append("<li id='" + cname1 + "'><a href='#'>" + cname1 + "</a></li>"); 
      }); 

     } else { 
      $("#nav .categories").append("<li id='" + cname + "'><a href='#'>" + cname + "</a></li>"); 
     } 
    }); 

}

我的，我想在頁面上的HTML附加無序列表：

<ul id="nav" class="categories"></ul>

這最終會重複一些代碼並且不是遞歸的，我想獲得一些可以回憶parseXml函數的東西，並在樹中不重複元素的地方傳遞一些參數。我寧願垃圾這個功能，並從更乾淨整潔的東西開始。

是否有任何jQuery插件可以做到這一點。我已經檢查過這個網站和谷歌，但沒有什麼我正在尋找這個壞的XML的作品。我發現的所有其他人都使用格式良好的XML結構。

在此先感謝。

來源

2013-03-07 Paul

據我所見，你的XML *格式良好。是什麼讓你覺得它不是？ – Alohci 2013-03-07 17:58:01

也許我說錯了，我的意思是一個非典型的XML結構，其中所有節點的名稱都是相同的，或者可能有另一個術語？ – Paul 2013-03-07 18:02:05

呃？他張貼的XML格式不正確。這兩個密切的標籤不應該在那裏。事情是，如果它不是很好的形式，它不是XML，這是寫得不好的標記。或者可能不只是再看一遍......我的不好看 – 2013-03-07 18:09:26

這個怎麼樣？

<html> 
<body> 
<script> 

var isIE = (window.attachEvent); 


var txt = "<class name=\"Juice\"><class name=\"OJ\"><class name=\"Low Sugar\" /><class name=\"Some Pulp\" /></class><class name=\"Apple\" /><class name=\"Grape\" /></class>"; 
var doc = NewXmlDoc(txt); 
var output = "<ul>"; 
WalkTree(doc.documentElement); 
output+="</ul>"; 
alert(output); 

function WalkTree(node) 
{ 
    output += "<li>"+node.getAttribute("name"); 
    if (node.childNodes.length > 0) 
    { 
     output += "<ul>"; 
     for (var inx = 0; inx < node.childNodes.length; inx++) 
     { 
      var childNode = node.childNodes[inx]; 
      WalkTree(childNode); 
     } 
     output += "</ul>"; 
    } 
    output += "</li>"; 
} 


function NewXmlDoc(sXml) 
{ 
    var xmlDoc; 
    if (isIE) 
    { 
    xmlDoc = new ActiveXObject("Microsoft.XMLDOM") 
    xmlDoc.async = false; 
    xmlDoc.loadXML(sXml); 
    if (xmlDoc.parseError.errorCode != 0) 
     return null; 
    } 
    else if (document.implementation && document.implementation.createDocument) 
    xmlDoc = (new DOMParser()).parseFromString(sXml, "text/xml"); 

    return xmlDoc; 
} 

/* Result is... 
<ul> 
    <li>Juice 
     <ul> 
     <li>OJ 
      <ul> 
       <li>Low Sugar</li> 
       <li>Some Pulp</li> 
      </ul> 
     </li> 
     <li>Apple</li> 
     <li>Grape</li> 
     </ul> 
    </li> 
</ul> 
*/ 

</script>

來源

2013-03-07 22:51:20

工作很好！謝謝你幫助我！ – Paul 2013-03-08 17:16:44

將格式不正確的XML文檔轉換爲HTML無序列表

回答

相關問題