1

私は、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構造を使用しています。

前もって感謝します。

4

1 に答える 1

1

これはどう？

<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-07T22:51:20.030 に答える