[英]Transpose non-well formed XML document to an HTML Unordered List
我正在一個需要我解析XML不太好的XML樹的項目中。 我需要從XML定義UL結構,但問題是所有節點都是具有不同屬性的相同名稱。 我正在使用jQuery ajax函數來調用此XML文件,並在成功后返回它。 這是我的難題:
> <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插件。 我已經檢查了這個網站和Google,但我找不到與此不良XML兼容的任何產品。 我發現的所有其他文件都使用格式良好的XML結構。
提前致謝。
這個怎么樣?
<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>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.