如何获取xml所有子节点值?

时间:2013-04-22 17:45:07

标签: javascript jquery html xml xml-parsing

我有一个xml xml包含文件夹和图像的详细信息。我使用jquery加载一个xml,我得到了文件夹的详细信息,但是图像路径现在没有正确得到我

图片/ ftest1.png,图像/ fstest1.png,图像/ fsstest1.png,图像/ stest1.png,图像/ sstest1.png

如何获得所有?

mycode的

    <script>
    $(document).ready(function(){
      $("#dvContent").append("<ul></ul>");
      $.ajax({
        type: "GET",
        url: "books.xml",
        dataType: "xml",
        success: function(xml){
        $(xml).find("FolderName").each(function(index, element){ 
        var levels = $(this).parents("OrgFolderDetails").size();
        var text = $(this).attr('name');
        var text1 = $(this).text();
        var html = "";
        //alert($(this).find("child[value='"+text+"']"));
        //alert($(this).children().size())
        var level_child=$(this).children().size();
        for(var j=0; j < level_child; j++){
            alert($(this).children().attr('path'));
        }
        for(var j=0; j < levels; j++){
            html += "-";  

        }


        html += "<li> "+text+"</li>"; //add in that space after the dashes, and the <br>

        $("#browser").append(html);
    });
      },
      error: function() {
        alert("An error occurred while processing XML file.");
      }
      });
    });

XML

    <?xml version="1.0" encoding="utf-8"?>
    <OrgFolderDetails>
      <FolderName name="Main Folder"></FolderName>
      <TheChildren>
      <OrgFolderDetails>
        <FolderName name="First Sub Folder">
          <source path="images/ftest1.png"></source>
          <source path="images/ftest2.png"></source>
          <source path="images/ftest3.png"></source>
          <source path="images/ftest4.png"></source>
          <source path="images/ftest5.png"></source>
        </FolderName>
        <TheChildren>
        <OrgFolderDetails>
          <FolderName name="First Sub Siub Sub Folder">
            <source path="images/fstest1.png"></source>
            <source path="images/fstest2.png"></source>
            <source path="images/fstest3.png"></source>
            <source path="images/fstest4.png"></source>
            <source path="images/fstest5.png"></source>
          </FolderName>
          <TheChildren>
          <OrgFolderDetails>
            <FolderName name="First Sub Siub Sub Folder">
              <source path="images/fsstest1.png"></source>
              <source path="images/fsstest2.png"></source>
              <source path="images/fsstest3.png"></source>
              <source path="images/fsstest4.png"></source>
              <source path="images/fsstest5.png"></source>
            </FolderName>
            <TheChildren>
            <OrgFolderDetails>
              <FolderName name="First Sub Sub Sub Sub Folder"></FolderName>
              <TheChildren/>
            </OrgFolderDetails>
            </TheChildren>
          </OrgFolderDetails>
          </TheChildren>
        </OrgFolderDetails>
        </TheChildren>
      </OrgFolderDetails>
      <OrgFolderDetails>
        <FolderName name="Second Sub Folder">
          <source path="images/stest1.png"></source>
          <source path="images/stest2.png"></source>
          <source path="images/stest3.png"></source>
          <source path="images/stest4.png"></source>
          <source path="images/stest5.png"></source>
        </FolderName>
        <TheChildren>
        <OrgFolderDetails>
          <FolderName name="Second Sub Sub Folder">
            <source path="images/sstest1.png"></source>
            <source path="images/sstest2.png"></source>
            <source path="images/sstest3.png"></source>
            <source path="images/sstest4.png"></source>
            <source path="images/sstest5.png"></source>
          </FolderName>
          <TheChildren/>
        </OrgFolderDetails>
        </TheChildren>
      </OrgFolderDetails>
      </TheChildren>
    </OrgFolderDetails>

提前致谢

2 个答案:

答案 0 :(得分:0)

显然你需要一个XML解析器。您可以使用jquery,js中的任何内容或者说一些perl cgi脚本来完成这项工作。查看this question,我认为它最能回答您的问题(很好地解答答案)也许this questionthis one可能对您有所帮助。

答案 1 :(得分:0)

如果在该xml文件上运行此XPath表达式〜// source [@path]〜,那么您将获得包含path属性的所有源元素的列表。然后,您可以从结果中获取所有图像。