使用新浪接口http://hq.sinajs.cn/list=外汇代码,Ajax实时刷新,完整代码如下,可根据需求自己进行改动
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<style>
ul{
border: 1px solid #999999;
margin: 0px auto 0px auto;
padding: 5px;
width: 100%;
display: -webkit-flex; /* Safari */
-webkit-align-items: center; /* Safari 7.0+ */
display: flex;
align-items: center;
height: auto;
box-sizing: border-box;
}
li{
padding: 8px;
list-style-type: none;
line-height: 30px;
min-width: 100px;
border-left-style: solid;
border-left-width: 1px;
border-left-color: #cccccc;
display: inline-block;
text-align: left;
-webkit-flex: 1; /* Safari 6.1+ */
flex: 1;
}
li:first-child{
border-left-style: none;
}
li:hover{
background-color: rgba(0,0,0,0.85);
color: #FFFFFF;
transition-delay:0.25s;
-webkit-tap-highlight-color: transparent;
}
body {
padding: 0px;
margin: 0px;
}
p {
padding: 0px;
margin: 0px;
font-weight: 600;
height: 30px;
}
</style>
</head>
<body>
<script type="text/javascript" src="https://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>
<ul>
<li>美元指数<p id="info_0"></p></li>
<li>黄金<p id="info_1"></p></li>
<li>白银<p id="info_2"></p></li>
<li>原油<p id="info_3"></p></li>
<li>欧元/美元<p id="info_4"></p></li>
<li>英镑/美元<p id="info_5"></p></li>
<li>纽元/美元<p id="info_6"></p></li>
<li>澳元/美元<p id="info_7"></p></li>
<li>美元/日元<p id="info_8"></p></li>
<li>美元/瑞郎<p id="info_9"></p></li>
<li>美元/加元<p id="info_10"></p></li>
<li>英镑/日元<p id="info_11"></p></li> </ul>
<script type="text/javascript">
$(document).ready(function(){
$(function () {
setInterval(function () {
parseDataM();
},3000);
})
});
function parseDataM(){
$.ajax({
url:"http://hq.sinajs.cn/list=DINIW,hf_XAU,hf_XAG,hf_CL,EURUSD,GBPUSD,NZDUSD,AUDUSD,USDJPY,USDCHF,USDCAD,GBPJPY",
dataType:"script",
cache:"false",
type:"GET",
success:function(a){
var gp0=hq_str_DINIW.split(",");
var gp1=hq_str_hf_XAU.split(",");
var gp2=hq_str_hf_XAG.split(",");
var gp3=hq_str_hf_CL.split(",");
var gp4=hq_str_EURUSD.split(",");
var gp5=hq_str_GBPUSD.split(",");
var gp6=hq_str_NZDUSD.split(",");
var gp7=hq_str_AUDUSD.split(",");
var gp8=hq_str_USDJPY.split(",");
var gp9=hq_str_USDCHF.split(",");
var gp10=hq_str_USDCAD.split(",");
var gp11=hq_str_GBPJPY.split(",");
document.getElementById("info_0").innerHTML = gp0[1];
document.getElementById("info_1").innerHTML = gp1[0];
document.getElementById("info_2").innerHTML = gp2[0];
document.getElementById("info_3").innerHTML = gp3[0];
document.getElementById("info_4").innerHTML = gp4[2];
document.getElementById("info_5").innerHTML = gp5[2];
document.getElementById("info_6").innerHTML = gp6[1];
document.getElementById("info_7").innerHTML = gp7[1];
document.getElementById("info_8").innerHTML = gp8[1];
document.getElementById("info_9").innerHTML = gp9[1];
document.getElementById("info_10").innerHTML = gp10[1];
document.getElementById("info_11").innerHTML = gp11[1];
}
});
}
</script>
</body>
</html>
url:"http://hq.sinajs.cn/list=DINIW,hf_XAU,hf_XAG,hf_CL,EURUSD,GBPUSD,NZDUSD,AUDUSD,USDJPY,USDCHF,USDCAD,GBPJPY",
var gp0=hq_str_DINIW.split(",");
list=“外汇代码”,多个用逗号隔开,
gp0=hq_str_“外汇代码”.split(",");
现学现卖功力有限,比较简陋,没有涨幅变动及颜色变换显示功能,本文出自“USDclub”