Получить все иерархическое имя корневых элементов для XML ребенка

Question

У меня есть файл XML, как показано ниже:

<?xml version="1.0" encoding="UTF-8"?> 
<!DOCTYPE xml> 
<Root> 
    <Menu title="Menu 1" url="root_pages.php?id=1"> 
     <SubMenu title="sub 1" url="pages.php?id=1" /> 
     <SubMenu title="sub 2" url="pages.php?id=2" /> 
     <SubMenu title="sub 3" url="pages.php?id=3" /> 
     <SubMenu title="sub 4" url="pages.php?id=4" /> 
     <SubMenu title="sub 5" url="pages.php?id=5" /> 
    </Menu> 
    <Menu title="Menu 2" url="root_pages.php?id=2"> 
     <SubMenu title="sub 6" url="pages.php?id=6" /> 
     <SubMenu title="sub 7" url="pages.php?id=7" /> 
    </Menu> 
    <Menu title="Menu 3" url="root_pages.php?id=3"> 
    </Menu> 
</Root> 

Теперь я пытаюсь сделать что-то вроде для каждого элемента я могу получить полный путь иерархии (например, навигационной цепочка) ,

Например, если я возьму <SubMenu title="sub 3> этот элемент, то результат будет: корень/Меню 1/sub3

Есть ли простой и легкий способ сделать это?

Спасибо, Surodip

Answer 1

var data = $.parseXML($("pre").html()); 
 
var xml = $(data.documentElement); 
 
var res = ""; 
 
var elem = xml.find("[title='sub 3']"); 
 
elem.parents().add(elem).each(function(i, el) { 
 
    res += ($(el).attr("title") || el.tagName) + "/" 
 
}); 
 
$("body").prepend(res);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<pre> 
 
<Root> 
 
    <Menu title="Menu 1" url="root_pages.php?id=1"> 
 
     <SubMenu title="sub 1" url="pages.php?id=1"></SubMenu> 
 
     <SubMenu title="sub 2" url="pages.php?id=2"></SubMenu> 
 
     <SubMenu title="sub 3" url="pages.php?id=3"></SubMenu> 
 
     <SubMenu title="sub 4" url="pages.php?id=4"></SubMenu> 
 
     <SubMenu title="sub 5" url="pages.php?id=5"></SubMenu> 
 
    </Menu> 
 
    <Menu title="Menu 2" url="root_pages.php?id=2"> 
 
     <SubMenu title="sub 6" url="pages.php?id=6"></SubMenu> 
 
     <SubMenu title="sub 7" url="pages.php?id=7"></SubMenu> 
 
    </Menu> 
 
    <Menu title="Menu 3" url="root_pages.php?id=3"> 
 
    </Menu> 
 
</Root> 
 
</pre>