jQuery XML解析 - 返回子元素的父元素
问题描述:
我试图在搜索子元素时返回父元素,然后显示并行子元素的文本。jQuery XML解析 - 返回子元素的父元素
XML:
<store>
<shelf>
<book>
<name>Book_1</name>
<id>1</id>
</book>
<book>
<name>Book_2</name>
<id>2</id>
</book>
<book>
<name>Book_1</name>
<id>3</id>
</book>
</shelf>
</store>
的jQuery:
$(document).ready(function(){
$.ajax({
type: "GET",
url: "xml_file.xml",
dataType: "xml",
success: parseXml
});
});
function parseXml(xml){
var books = $(xml).find('name').filter(function() {
return $(this).text() === 'Book_1';
}).parent();
for(i=0; i<books.length; i++){
$('#results').text(
(books[i]).find('id').text()
);
}
}
HTML:
<div id="results"></div>
所以基本上,如果我搜索了 “名” 与具有文本 “书”,我想收回2本书。比我想要显示每本书到ID =“结果”的div。任何帮助,将不胜感激。谢谢!
答
你的XML是无效的,你少根节点,并</aid>
应该</id>
像
<shelf>
<book>
<name>Book_1</name>
<id>1</id>
</book>
<book>
<name>Book_2</name>
<id>2</id>
</book>
<book>
<name>Book_1</name>
<id>3</id>
</book>
</shelf>
而且你错过了在praseXml一个$
和使用的.text将在写入所有之前的值
function parseXml(xml){
var books = $(xml).find('name').filter(function() {
return $(this).text() === 'Book_1';
}).parent();
for(i=0; i<books.length; i++){
$('#results').append(
$(books[i]).find('id').text()
);
}
}
+0
我更新了原来的问题示例XML。这很好,谢谢! –
答
设置你的XML成brev一个局部变量性。
var $xml = $("<books><book><name>Book_1</name><id>1</aid></book><book><name>Book_2</name><id>2</aid></book><book> <name>Book_1</name><id>3</aid></book></books>")
var searchString = "Book_1";
var matchedBooks = $xml
.children('book') /* Get all the books */
.children('name') /* And then the names. You could just get the names first, but this will allow you to exclude nodes not inside of a book element */
.filter(function(i,v){ return $(v).text() == searchString; }) /* This excludes non matching names. */
.parent('book'); /* Now we have 2 matching elements, on each, get the parent element */
/* Build the html then append to save DOM interaction speed tax */
var resultHtml = "";
$(matchedBooks).each(function(i, e){
resultHtml += "<p>" + $(e).find('id').text() + "</p>";
});
$("#results").html(resultHtml);
让我知道这是否回答您的问题
则可以将XML一些地方或给示例XML使用的网址... –