[英]What am I missing in my code? Javascript and XML
我是XML,html和javascript的初学者。 我编写了一些代码来捕获和连接html中的所有title元素,但是我无法以所需的方式显示输出。 有人可以看一下我的代码,并给我一些有关如何修复我的代码的提示吗? 预先感谢您的帮助。
当前:结果:我要访问的城市日本东京圣托里尼希腊美国芝加哥
我想要看起来像这样的东西:
这是XML文件:
<?xml version="1.0"?>
<rss version="0.92">
<channel>
<title>Cities I Want to Visit</title>
<link>http://pinterest.com/manicmonster/cities-i-want-to-visit</link>
<Description>I love traveling!</Description>
<item>
<title>Tokyo, Japan</title>
<link>http://www.gotokyo.org/en</link>
</item>
<item>
<title>Santorini, Greece</title>
<link>http://www.visitgreece.gr/en/greek_islands/santorini</link>
</item>
<item>
<title>Chicago, USA</title>
<link>http://www.cityofchicago.org/city/en.html</link>
</item>
<item>
<title>Rome, Italy</title>
<link>http://www.turismoroma.it/?lang=en</link>
</item>
</channel>
</rss>
这是html文件:
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<title>Practice</title>
<meta charset="UTF-8">
</head>
<body>
<div id="clickme" onclick="startAjax()">Click me</div>
<script>
function startAjax(){
$("#clickme").text("Calling server");
$.ajax({url:"test.xml",
success:callbackFunction, error:errorFunction});
}
function callbackFunction(data,info){
var titles = $(data).find("title:first");
var items = $(data).find("item title");
if (titles && titles.length)
$("#clickme").text("result: " + titles.text() + " " + items.text());
else
errorFunction(data, "No titles");
}
function errorFunction(data,info){
$("#clickme").text("error occurred:"+info);
}
</script>
</body>
</html>
function callbackFunction(data,info){
var titles = $(data).find("title:first"),
items = $(data).find("item").reverse(),
items_idx = items.length,
html= "";
while (items_idx--){
var txt = items[items_idx].find("title").text(),
url = items[items_idx].find("link").text();
html += "<li><a href='" + url + "'>" + txt + "</a></li>";
}
if (titles && titles.length)
$("#clickme").text("result: " + titles.text() + " <ul>" + html + "</ul>");
else
errorFunction(data, "No titles");
}
var items = $(data).find("item title");
此行获取xml节点的集合。 稍后,当您的代码执行此行时:
items.text()
它接受集合并返回用逗号分隔的值字符串。 (例如日本东京,圣托里尼岛,希腊芝加哥,美国罗马,意大利)
正如Malk所暗示的,您需要使用循环来获取每个单独的值并将其添加到列表中。 您可以使用该示例,也可以使用jQuery集合中的each
方法
html = "";
items.each(function(index, value) {
html += "<li>" + value + "</li>";
});
当然,假设您需要一个项目符号列表。 但是这个想法是正确的,即遍历整个集合似乎更接近于您想要的。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.