使用jQuery遍历XML [英] Looping through XML with jQuery
问题描述
我有一些基本代码,可以遍历从Adobe RoboHelp生成的XML(对于我们的帮助文档).效果很好,但是由于可以根据作者的需要嵌套一个主题,因此我需要一种更好的方法来遍历此XML,而不仅仅是嵌套.each()
循环.
I've got some basic code that can loop through some XML that's generated from Adobe RoboHelp (for our help documentation). This works fine, but since a topic could be nested as many time as the writer wants, i need a better way to loop through this XML rather than just nesting .each()
loops.
这是XML的样子
<?xml version="1.0" encoding="utf-8"?>
<!--RoboML: Table of Content-->
<roboml_toc>
<page title="Welcome" url="Welcome.htm"/>
<book title="Getting Started" url="Getting_Started/Initial_Setup.htm">
<page title="Initial Setup" url="Getting_Started/Initial_Setup.htm"/>
<page title="Customize Settings" url="Getting_Started/Settings.htm"/>
</book>
<book title="Administrator Services" url="Administrator_Services/General_Administrator.htm">
<book title="Portal Workspace" url="Administrator_Services/Portal_Workspace/AdminHome.htm">
<page title="Home" url="Administrator_Services/Portal_Workspace/AdminHome.htm"/>
<page title="Portal Accounts" url="Administrator_Services/Portal_Workspace/Portal_Accounts.htm"/>
</book>
<book title="SpamLab" url="Administrator_Services/SpamLab/SpamLab_Admin_General.htm">
<page title="Alerts" url="Administrator_Services/SpamLab/Alerts.htm"/>
<page title="Spam Quarantine" url="Administrator_Services/SpamLab/Admin_Spam_Quarantine_.htm"/>
</book>
</book>
<book title="User Services" url="User_Services/General_User.htm">
<book title="Portal Workspace" url="User_Services/Portal_Workspace/Home.htm">
<page title="Home" url="User_Services/Portal_Workspace/Home.htm"/>
<page title="Self Help" url="User_Services/Portal_Workspace/Self_Help.htm"/>
</book>
<book title="SpamLab" url="User_Services/SpamLab/SpamLab_General.htm">
<page title="Spam Quarantine" url="User_Services/SpamLab/Spam_Quarantine.htm"/>
<page title="Virus Quarantine" url="User_Services/SpamLab/Virus_Quarantine.htm"/>
</book>
<book title="Encryption" url="User_Services/Encryption/Encryption_General.htm">
<page title="Outlook Plug-in" url="User_Services/Encryption/Encryption_Outlook_Plug_in.htm"/>
</book>
</book>
</roboml_toc>
<page>
是文章,<book>
是文件夹.
这是我的jQuery代码,只能看到标记深一层
Her's my jQuery code, which only can look one level deep of tags
//Get the TOC
$tocOutput="";
$.get(tocURL,function(toc){
$(toc).children().each(function(){
$tocOutput+="<li><a href='"+$(this).attr("url")+"'>"+$(this).attr("title")+"</a>";
if(this.tagName=="BOOK"){
$tocOutput+="<ul>";
$(this).find("page").each(function(){
$tocOutput+="<li><a href='"+$(this).attr("url")+"'>"+$(this).attr("title")+"</a></li>";
});
$tocOutput+="</ul>";
}
$tocOutput+="</li>";
});
$("#list").html($tocOutput);
我知道有一种更好的方法来遍历所有元素,然后确定该元素是否有子元素,等等,但是我只是想不起来怎么做.
I know there's a better way to just loop through all elements and then determine if the element has children, etc. but I just can't think of how to do it.
任何帮助将不胜感激!
推荐答案
递归函数可以很好地解决此问题.当您创建一个创建并使用内部递归闭包的函数时,可以将其全部包装在一个简洁的小程序包中:
Recursive functions work well for this. When you create a function that creates and uses an internal recursive closure you can wrap it all up in a neat little package:
$.get(tocURL, function(toc) {
function makeToc($xml) {
// variable to accumulate markup
var markup = "";
// worker function local to makeToc
function processXml() {
markup += "<li><a href='" + $(this).attr("url") + "'>" + $(this).attr("title") + "</a>";
if (this.nodeName == "BOOK") {
markup += "<ul>";
// recurse on book children
$(this).find("page").each(processXml);
markup += "</ul>";
}
markup += "</li>";
}
// call worker function on all children
$xml.children().each(processXml);
return markup;
}
var tocOutput = makeToc($(toc));
$("#list").html(tocOutput);
});
这篇关于使用jQuery遍历XML的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!