使用javascript / jquery获取Youtube视频信息 [英] Getting Youtube Video Information using javascript/jquery
问题描述
<script type= "text/javascript">
var url = "http://gdata.youtube.com/feeds/api/videos/VA770wpLX-Q?v=2&alt=json-in-script&callback=";
var title;
var description;
var viewcount;
var views;
var author;
$.getJSON(url,
function(data){
title = data.entry.title.$t;
description = data.entry.media$group.media$description.$t;
viewcount = data.entry.yt$statistics.viewCount;
views = numberFormat (viewcount);
author = data.entry.author[0].name.$t;
listInfo (title,description,author,views);
});
</script>
这就是我的代码从单个视频获取信息，收到信息后调用此函数显示它：
So thats my code to get information from a single video, after the info is received it calls this function to display it:
<script type="text/javascript">
function listInfo (title,description,author,views) {
var html = ['<dl>'];
html.push('<dt>','<span class="titleStyle">', title,'</span><span class="descriptionStyle">',description, '</span><span class="authorStyle">',author,'</span><span class="viewsStyle">',' Views:',views,'</span></dt>');
html.push('</dl>');
document.getElementById("agenda").innerHTML = html.join("");
}
function numberFormat(nStr,prefix){
var prefix = prefix || '';
nStr += '';
x = nStr.split('.');
x1 = x[0];
x2 = x.length > 1 ? '.' + x[1] : '';
var rgx = /(\d+)(\d{3})/;
while (rgx.test(x1))
x1 = x1.replace(rgx, '$1' + ',' + '$2');
return prefix + x1 + x2;
}
</script>
之后它将定义List放入一个div，我在表格中有
After that it puts the definition List into a div, which I have inside a table
<table width="485"><tr><td><div id="agenda"></div></td></tr></table>
所有这些信息都在身体中找到，我似乎无法让它工作，我已经尝试了一个星期了，我找不到任何方法让它工作
all of this information is found in the body, I can't seem to get it to work, I've been trying for a week now, and I can't find any way to make it work
推荐答案
自youtube以来API不允许在单个请求中返回超过50条评论，您需要添加一个名为start-index的URL参数，该参数告诉youtube您希望从那里获得评论。以下是一个例子。我已经做到这一点，只要响应JSON返回50条评论，它就会在接下来的50条评论中再次调用该函数。
Since the youtube API does not allow more than 50 comments to be returned on a single request, you'll need to add a URL parameter called "start-index", which tells youtube that you want to get comments from there onwards. Below is an example. I've made it so that as long as the response JSON returns 50 comments, it calls the function again for the next 50 comments.
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.5.1.min.js"></script>
<script type= "text/javascript">
function getYouTubeInfo() {
$.ajax({
url: "http://gdata.youtube.com/feeds/api/videos/<?php echo $_GET['v']; ?>?v=2&alt=json",
dataType: "jsonp",
success: function (data) { parseresults(data); }
});
}
function parseresults(data) {
var title = data.entry.title.$t;
var description = data.entry.media$group.media$description.$t;
var viewcount = data.entry.yt$statistics.viewCount;
var author = data.entry.author[0].name.$t;
$('#title').html(title);
$('#description').html('<b>Description</b>: ' + description);
$('#extrainfo').html('<b>Author</b>: ' + author + '<br/><b>Views</b>: ' + viewcount);
getComments(data.entry.gd$comments.gd$feedLink.href + '&max-results=50&alt=json', 1);
}
function getComments(commentsURL, startIndex) {
$.ajax({
url: commentsURL + '&start-index=' + startIndex,
dataType: "jsonp",
success: function (data) {
$.each(data.feed.entry, function(key, val) {
$('#comments').append('<br/>Author: ' + val.author[0].name.$t + ', Comment: ' + val.content.$t);
});
if ($(data.feed.entry).size() == 50) { getComments(commentsURL, startIndex + 50); }
}
});
}
$(document).ready(function () {
getYouTubeInfo();
});
</script>
<title>YouTube</title>
</head>
<body bgcolor="grey">
<div align="center">
<br/><br/>
<div id="title" style="color: #dddddd">Could not find a title</div><br/>
<iframe title="Youtube Video Player" width="640" height="390" src="http://www.youtube.com/embed/<?php echo $_GET['v']; ?>?fs=1&autoplay=1&loop=0" frameborder="0" allowfullscreen style="border: 1px solid black"></iframe>
<br/><br/>
<div id="description" style="width:400px; background-color: #dddddd; font-size:10px; text-align:left;">Could not find a description</div>
<div id="extrainfo" style="width:400px; background-color: #dddddd; font-size:10px; text-align:left;">Could not find extra information</div>
<div id="comments" style="width:400px; background-color: #dddddd; font-size:10px; text-align:left;">Could not find comments</div>
</div>
</body>
</html>
如果您有任何其他问题或者您对此代码感到困惑，请不要犹豫再问： - ）
If you have any more questions or you get stuck with this code, don't hesitate to ask again :-)
祝你好运，
Tom
Good luck, Tom
这篇关于使用javascript / jquery获取Youtube视频信息的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
