js实现股票实时刷新数据
近来学习炒股，免不了上班时间看盘，总不能光明正大的用电脑看行情，一直盯着手机影响也不好，容易引起“关注”。
所以就想自己做一个网页来达到看盘的目的，一个只显示几个关键数字的网页肯定不会引起怀疑。有想法了，就开始实现吧。
准备工作：
1、数据来源
2、网页数据显示
先帖出来源码，后面讲解
<!-- 说明：股票看盘 作者：黑桃A 时间：2014-04-14 --> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <meta charset="utf-8" /> <head> <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.1.min.js"></script> <script type="text/javascript"> var stockCode="600804"; $(document).ready(function(){ getNewData(); var tg=self.setInterval("getNewData()",2000);//N毫秒刷新一次，1000毫秒＝1秒 }); //获取新数据 function getNewData() { if(getQueryString(\'c\')!=undefined) { stockCode=getQueryString(\'c\'); } var type=stockCode[0]==6?1:2; var durl="http://flashquote.stock.hexun.com/Stock_Combo.ASPX?mc="+type+"_"+stockCode+"&dt=T&t="+Math.random(); $.getScript(durl,function(data){ //加载脚本并执行 }); } //刷新显示 function refreshData(code,type,tip,data) { var result=""; result+=code; result+="<br/>"; result+= data[1]+\'\t\'+data[2]+\'\t\'+data[3]+\'\t\'+data[4]+\'\t \'+data[5]+\'\t\'+percent+\'%\'; result+=\'<div style="height:10px;width:100px;"></div>\' result+=\'\'+data[24]+\'\t\t\'+data[25]; result+=\'<br/>\'+data[22]+\'\t\t\'+data[23]; result+=\'<br/>\'+data[20]+\'\t\t\'+data[21]; result+=\'<br/>\'+data[18]+\'\t\t\'+data[19]; result+=\'<br/>\'+data[16]+\'\t\t\'+data[17]; result+=\'<div style="height:1px;width:100px; border-top:dashed 1px #CCCCCC"></div>\' result+=\'\'+data[6] +\'\t\t\'+data[7]; result+=\'<br/>\'+data[8] +\'\t\t\'+data[9]; result+=\'<br/>\'+data[10]+\'\t\t\'+data[11]; result+=\'<br/>\'+data[12]+\'\t\t\'+data[13]; result+=\'<br/>\'+data[14]+\'\t\t\'+data[15]; $("#result").html(result); } //getQueryString获取url参数 function getQueryString(name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i"); var r = window.location.search.substr(1).match(reg); if (r != null) return unescape(r[2]); return null; } </script> </head> <body> <div id="result" style="color:#CCCCCC;"></div> </body> </html>
数据来源
如果不知道现有可用的数据源，就百度吧。百度搜索“股票数据接口”
搜到的结果如下，这是一个浪新博客里的，相信读者都能很容易的找到。
Sina股票数据接口
以大秦铁路（股票代码：601006）为例，如果要获取它的最新行情，只需访问浪新的股票数据
接口：http://hq.sinajs.cn/list=sh601006这个url会返回一串文本，例如：
var hq_str_sh601006=”大秦铁路, 27.55, 27.25, 26.91, 27.55, 26.20, 26.91, 26.92,
22114263, 589824680, 4695, 26.91, 57590, 26.90, 14700, 26.89, 14300,
26.88, 15100, 26.87, 3100, 26.92, 8900, 26.93, 14230, 26.94, 25150, 26.95, 15220, 26.96, 2008-01-11, 15:05:32″;
这里用我自己熟悉的一个“接口”，我经常在和讯网上看行情，财经新闻等，知道它有一个可用的数据来源。这里还是详细点说明一下我是怎么发现“接口”的。
①在浏览器里打开一只个股的页面，如http://stockdata.stock.hexun.com/gghq_600050.shtml。然后打开浏览器的开发工具，我用的chrome，火狐里有firebug也挺好。切换到开发工具的“网络”标签，观察一下，很容易就能找到隔几秒，就会加载一个js，如图1所示
图1
②链接地址 flashquote.stock.hexun.com/Stock_Combo.ASPX?mc=1_600050&dt=MX,DL&t=0.9482741139363497
就是这样一个连接，在浏览器里打开，可以看到如下的内容
refreshData(\'600050\',\'1\',\'Q\',[\'20140414150001\',\'3.16\',\'3.16\',\'3.16\',\'3.13\',\'3.14\',\'3.13\',\'3668496\',\'3.12\',\'3011500\',\'3.11\',\'1858100\',\'3.10\',\'2850000\',\'3.09\',\'955100\',\'3.14\',\'61400\',\'3.15\',\'4566385\',\'3.16\',\'3849399\',\'3.17\',\'1490702\',\'3.18\',\'2654615\',\'55099344\',\'172995571\',\'8700\',\'0.49\',\'19.33\',\'0.0026\',\'31982854\',\'22913509\']);refreshData(\'600050\',\'1\',\'MX\',[[\'1458\',\'3.15\',\'129800\',\'407904\'],[\'1459\',\'3.14\',\'580900\',\'1824318\'],[\'1500\',\'3.14\',\'8700\',\'27318\']]);refreshDeal(\'DL\',[[\'150001\',\'3.14\',\'8700\',\'2\'],[\'145956\',\'3.14\',\'3700\',\'2\'],[\'145951\',\'3.14\',\'30500\',\'1\'],[\'145946\',\'3.15\',\'1100\',\'2\'],[\'145941\',\'3.15\',\'100\',\'2\'],[\'145936\',\'3.14\',\'508000\',\'1\'],[\'145921\',\'3.14\',\'2000\',\'1\'],[\'145916\',\'3.14\',\'6000\',\'1\'],[\'145906\',\'3.15\',\'28500\',\'2\'],[\'145901\',\'3.14\',\'1000\',\'1\']]);
这是一段js脚本，执行refreshData方法，其他就是这个方法的参数了。参数一看就明白了，正是股票的实时盘口数据。
网页数据显示
数据来源已经有了，开始第二步吧。做一个网页来加载这些数据。做js简单的就是用jquery吧， 一个很优秀的js库。
这一步比较简单，用jquery里的ajax方法加载数据，显示。
加载方法 $.getScript。因为原数据里有个refreshData方法，加载完成后会自动执行的，所以我的代码里也声明了一个同名方法在这里处理就行了。refreshData里把参数，和参数对应的内容显示到div里，怎么样都行，只要能在页面上看到。
setInterval用这个方法，让页面自动刷新，N秒钟执行一次。
getQueryString 这个方法是获取页面参数的，我们不可能只看一只股票，要看别的股票就要改代码，虽然不难，但用参数更简单，现在想看哪只股票，只要在页面url后添加参数demo.html?c=000777，这样就搞定了
第一次写这样的博客，当练手了，以后每天坚持写点东西