2015年10月23日
No comments
Article
基于QQ空间API和jsonp跨域的QQ空间背景音乐查询
源代码如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>按QQ号码搜空间背景音乐</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<meta name="按QQ号码搜空间背景音乐" content="EverEdit" />
<meta name="按QQ号码搜空间背景音乐" content="按QQ号码搜空间背景音乐" />
<meta name="按QQ号码搜空间背景音乐" content="按QQ号码搜空间背景音乐" />
<meta name="description" content="按QQ号码搜空间背景音乐" />
<link href="./163music.css" rel="stylesheet">
<script type="text/javascript" src="http://cdn.bootcss.com/jquery/3.0.0-alpha1/jquery.js"></script>
<script type="text/javascript" id="qq">
//window.location.replace("http://qzone-music.qq.com/fcg-bin/cgi_playlist_xml.fcg?json=1&uin=");
/*function changesrc(){
//setInterval(function(){
var jsp = document.createElement("script");
jsp.type = "text/javascript";
jsp.src = "http://qzone-music.qq.com/fcg-bin/cgi_playlist_xml.fcg?json=1&uin="+document.getElementById("text").value;
document.getElementById("body").appendChild(jsp);
}*/
</script>
<style type="text/css" media="screen">
</style>
</head>
<body id="body">
<div id="test" class="wrap">
<h2>按QQ号码搜空间背景音乐</h2>
<p>可用于QQ空间背景音乐,也可直接下载</p>
<form method="get" action="" id="search" name="music">
<div id="MusicName">QQ号码:</div>
<input id="text" type="text" name="uin" value="695966004" />
<button name="test" id="btn" type="button" value="val">搜一搜</button>
</form>
</div>
<div class="js">
<script type="text/javascript">
$(function(){
$("#btn").click(function(){
var uin = $("#text").val();
//利用ajax处理jsonp跨域问题
$.ajax({
url: "http://qzone-music.qq.com/fcg-bin/cgi_playlist_xml.fcg?json=1",
data: {uin: uin},
dataType: 'jsonp',
jsonp: "jsonpCallback",
jsonpCallback: "jsonCallback",
success: function jsonCallback(result){
document.write("<!DOCTYPE html><html><head><title>根据QQ号查询并下载空间背景音乐</title><meta http-equiv='Content-type' content='text/html; charset=UTF-8' /><meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'><meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0'><link href='./163music.css' rel='stylesheet'></head><body><h2>查询结果如下</h2><div id='back'><a href='./tt.html'>返回搜索页</a></div><table border='2'>");
for(var i=0;i<(result['qqmusic']['playlist']['song'].length);i++)
{
document.write("<tr>");
document.write("<td>"+(i+1)+"</td>");
document.write("<td>"+result['qqmusic']['playlist']['song'][i]['xsong_name']+"</td>");
document.write("<td>"+result['qqmusic']['playlist']['song'][i]['xsinger_name']+"</td>");
document.write("<td>"+result['qqmusic']['playlist']['song'][i]['xsong_url']+"</td>");
document.write("</tr>");
}
document.write("</table><div class='achor'><ul><li id='blog'><a href='http://www.jiantong.cc'>点一下又不会怀孕</a></li><li id='hexo'><a href='http://liujianpc.github.io'>看一下也不会怀孕</a></li><li id='home'><a href='http://kindlers.sinaapp.com'>带你飞</a></li><li id='wangyi'><a href='http://music.163.com'>网易云音乐</a></li></ul><body>");
},
error: function(jqXHR, textStatus, errorThrown){
alert(textStatus);
}
});
});
});
</script>
</div>
<div class="achor">
<ul>
<li id="blog"><a href="http://www.jiantong.cc">点一下又不会怀孕</a>
</li>
<li id="hexo"><a href="http://liujianpc.github.io">看一下也不会怀孕</a>
</li>
<li id="home"><a href="http://kindlers.sinaapp.com">带你飞</a>
</li>
<li id="wangyi"><a href="http://music.163.com">网易云音乐</a>
</li>
</ul>
</body>
</html>