使用jQuery解析烦人的Youtube API XML提要 [英] Parsing annoying Youtube API XML feeds with jQuery

查看:85
本文介绍了使用jQuery解析烦人的Youtube API XML提要的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在学习如何在Intranet中利用外部XML提要,以更好地为我们的员工提供服务,并减少他们需要从网络外获取内容的需求.

I am learning how to utilise external XML feeds within our Intranet, to better serve our staff and reduce their need to go outside the network for content.

我可以毫无问题地从提要中提供基本信息.我不满意的地方是尝试显示其中一个视频缩略图,以用作我选择的布局的一部分.

I can render the basic information from the feed without a problem. Where I come unstuck is trying to display one of the video thumbnails to use as part of the my chosen layout.

问题

我试图从第一个media:thumbnail元素中获取URL属性的值,以供在img标记中使用,但是无论如何,我似乎都无法呈现其内容.

I am trying to grab the value of URL property from the first media:thumbnail element for use in an img tag, but whatever I try I can't seem to render the contents of it.

例如; <media:thumbnail url='http://i.ytimg.com/vi/CQP_AuT4zXQ/default.jpg'... />

我要提取的文本内容&上例中使用的是http://i.ytimg.com/vi/CQP_AuT4zXQ/default.jpg

The piece of text I'd want to extract & use from the above example is http://i.ytimg.com/vi/CQP_AuT4zXQ/default.jpg

我怀疑为什么我无法解析该元素的值与其中包含句点(:)分隔符的元素名称有关,和/或我对jQuery的深入了解怀疑我没有调用或尝试正确解析此元素或其部分.

I suspect why I'm not able to parse the value of this element has something to do with the element name having a period (:) separator in it, and/or my developing knowledge of jQuery suspects I'm not calling or attempting to parse this element or part thereof correctly.

我也想渲染media:keywords的值,这可以通过理解相同的问题来解决.

I'd also like to render the value of media:keywords as well, which would be solved by understanding the same issue.

用于呈现XML的代码

<script type="text/javascript">
/* learned from http://www.switchonthecode.com/tutorials/xml-parsing-with-jquery */
/* this can be used to parse any file in an XML format */
$(document).ready(function()
{
/*
perform an asynchronous ajax request using the relevant variables
Documentation: http://api.jquery.com/jQuery.ajax/
*/
  $.ajax({
    type: "GET",
    /* define url of xml file to parse */
    url: "/pr/rss_repository/youtube.xml",
    /* assign it a data type */
    dataType: "xml",
    /* state name of function to run if file is successfully parsed */
    success: parseXml
  });
});
function parseXml(xml)
/* this is where the xml file is parsed and converted into a HTML output */
{

  //for each item node in the xml file
  $(xml).find("item").each(function()
  {
  //print the following html, inserting the relevant data within the nodes of item
    //this is the heading
    $("#output").append("<h2><a href=\"" + $(this).find("link").text() + "\" target=\"_blank\"> " + $(this).find("title").text() + "</a></h2>\n");
//this is a new paragraph with the publication date
    $("#output").append("<p>" + $(this).find("pubDate").text() + "</p>\n");
//this is the description text of the item
$("#output").append("<p>" + $(this).find("description").text() + "</p>\n");
$("#output").append("<p><img src=\"" + $(this).find("media:thumbnail").text() + "\"></p>\n");
  });
 //end for each
//end function
}
</script>

结果HTML

<h2><a href="http://www.youtube.com/watch?v=CQP_AuT4zXQ&amp;feature=youtube_gdata" target="_blank"> IFA World Forestry Day 2010 forum - Bob Pearce, FIFWA (Part 1)</a></h2>
<p>Thu, 01 Apr 2010 06:44:19 +0000</p>
<p>Bob Pearce, Executive Director - Forest Industries Federation of Western Australia delivers a presentation on the impact of timber harvesting in healthy forests at the Institute of Foresters of Australia 2010 World Forestry Day forum.</p>
<p><img src=""></p>
...

正在解析来自Youtube的XML示例

文件被抓取并带到这里的服务器中,以保存每次调用时下载的文件.我们使用VBScript将其拉入网络,该脚本转储从查询的URL返回的内容.

The file is grabbed and brought into our servers here, to save the file being downloaded each time it is called. We pull it into the network using VBScript which dumps the contents returned from the URL queried.

数据示例,来自 http://gdata. youtube.com/feeds/api/videos?alt=rss&author=fpcwa :

<?xml version='1.0' encoding='UTF-8'?>
<rss xmlns:atom='http://www.w3.org/2005/Atom' xmlns:media='http://search.yahoo.com/mrss/' xmlns:openSearch='http://a9.com/-/spec/opensearch/1.1/' xmlns:gd='http://schemas.google.com/g/2005' xmlns:gml='http://www.opengis.net/gml' xmlns:yt='http://gdata.youtube.com/schemas/2007' xmlns:georss='http://www.georss.org/georss' version='2.0'>
  <channel>
    ... standard channel description
    <item>
      <guid isPermaLink='false'>tag:youtube.com,2008:video:CQP_AuT4zXQ</guid>
      <pubDate>Thu, 01 Apr 2010 06:44:19 +0000</pubDate>
      <atom:updated>2010-04-29T00:03:31.000Z</atom:updated>
      <category domain='http://schemas.google.com/g/2005#kind'>http://gdata.youtube.com/schemas/2007#video</category>
      <category domain='http://gdata.youtube.com/schemas/2007/categories.cat'>News</category>
      <category domain='http://gdata.youtube.com/schemas/2007/keywords.cat'>ifa</category>
      ... remaining categories
      <title>IFA World Forestry Day 2010 forum - Bob Pearce, FIFWA (Part 1)</title>
      <link>http://www.youtube.com/watch?v=CQP_AuT4zXQ&feature=youtube_gdata</link>
      <author>fpcwa</author>
      <yt:accessControl action='comment' permission='allowed'/>
      ...
      <gd:comments>
        <gd:feedLink href='http://gdata.youtube.com/feeds/api/videos/CQP_AuT4zXQ/comments?client=ytapi-google-jsdemo' countHint='0'/>
      </gd:comments>
      <media:group>
        <media:category label='News & Politics' scheme='http://gdata.youtube.com/schemas/2007/categories.cat'>News</media:category>
        <media:content url='http://www.youtube.com/v/CQP_AuT4zXQ?f=videos&c=ytapi-google-jsdemo&app=youtube_gdata' type='application/x-shockwave-flash' medium='video' isDefault='true' expression='full' duration='587' yt:format='5'/>
        <media:content url='rtsp://v1.cache6.c.youtube.com/CjcLENy73wIaLgl0zfjkAv8DCRMYDSANFEITeXRhcGktZ29vZ2xlLWpzZGVtb0gGUgZ2aWRlb3MM/0/0/0/video.3gp' type='video/3gpp' medium='video' expression='full' duration='587' yt:format='1'/>
        <media:content url='rtsp://v2.cache3.c.youtube.com/CjcLENy73wIaLgl0zfjkAv8DCRMYESARFEITeXRhcGktZ29vZ2xlLWpzZGVtb0gGUgZ2aWRlb3MM/0/0/0/video.3gp' type='video/3gpp' medium='video' expression='full' duration='587' yt:format='6'/>
        <media:credit role='uploader' scheme='urn:youtube'>fpcwa</media:credit>
        <media:description type='plain'>Bob Pearce, Executive Director - Forest Industries Federation of Western Australia delivers a presentation on the impact of timber harvesting in healthy forests at the Institute of Foresters of Australia 2010 World Forestry Day forum.</media:description>
        <media:keywords>ifa, institute of foresters, australia, forestry, world forestry day, 2010, forum, healthy forests, forest, forests, bob pearce, fifwa</media:keywords>
        <media:player url='http://www.youtube.com/watch?v=CQP_AuT4zXQ&feature=youtube_gdata'/>
        <media:thumbnail url='http://i.ytimg.com/vi/CQP_AuT4zXQ/default.jpg' height='90' width='120' time='00:04:53.500'/>
        <media:thumbnail url='http://i.ytimg.com/vi/CQP_AuT4zXQ/2.jpg' height='90' width='120' time='00:04:53.500'/>
        <media:thumbnail url='http://i.ytimg.com/vi/CQP_AuT4zXQ/1.jpg' height='90' width='120' time='00:02:26.750'/>
        <media:thumbnail url='http://i.ytimg.com/vi/CQP_AuT4zXQ/3.jpg' height='90' width='120' time='00:07:20.250'/>
        <media:thumbnail url='http://i.ytimg.com/vi/CQP_AuT4zXQ/hqdefault.jpg' height='360' width='480'/>
        <media:title type='plain'>IFA World Forestry Day 2010 forum - Bob Pearce, FIFWA (Part 1)</media:title>
        <yt:aspectRatio>widescreen</yt:aspectRatio>
        <yt:duration seconds='587'/>
        <yt:uploaded>2010-04-01T06:44:19.000Z</yt:uploaded>
        <yt:videoid>CQP_AuT4zXQ</yt:videoid>
      </media:group>
      <yt:statistics favoriteCount='0' viewCount='10'/>
    </item>

推荐答案

这是jQuery中的错误,它不支持处理XML名称空间.您可以采用以下两种方法之一:

This is a bug in jQuery, where it does not support handling XML namespaces. You can one of the following two approaches:

.find("[nodeName=media:thumbnail]")
.find("media\\:thumbnail]")

大多数人推荐第一个,因为第二个在某些WebKit版本下不起作用.

Most people recommend the first one since the second one does not work under certain WebKit versions.

如果您需要更多详细信息或其他替代方法,请搜索"jquery查找命名空间" .

If you want more details or other alternatives, do a search for "jquery find namespace" on the web.

更新:要获取media:thumbnail节点上ulr属性的值,请使用以下命令:

Update: To get the value of the ulr attribute on the media:thumbnail node, use the following:

.attr("url")

这篇关于使用jQuery解析烦人的Youtube API XML提要的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆