zoukankan      html  css  js  c++  java
  • 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]+'	'+data[2]+'	'+data[3]+'	'+data[4]+'	  '+data[5]+'	'+percent+'%';
        
        result+='<div style="height:10px;100px;"></div>'   
         
        result+=''+data[24]+'		'+data[25];
        result+='<br/>'+data[22]+'		'+data[23];
        result+='<br/>'+data[20]+'		'+data[21];
        result+='<br/>'+data[18]+'		'+data[19];
        result+='<br/>'+data[16]+'		'+data[17];
              
        result+='<div style="height:1px;100px; border-top:dashed 1px #CCCCCC"></div>'             
        result+=''+data[6] +'		'+data[7];
        result+='<br/>'+data[8] +'		'+data[9];
        result+='<br/>'+data[10]+'		'+data[11];
        result+='<br/>'+data[12]+'		'+data[13];
        result+='<br/>'+data[14]+'		'+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所示

    js实现 股票实时数据 监测
    图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,这样就搞定了


    第一次写这样的博客,当练手了,以后每天坚持写点东西

    出处:http://www.lxway.com/240649562.htm

  • 相关阅读:
    面向中后台复杂场景的低代码实践思路
    树莓派使用raspivid实时预览视频
    grep rn无法匹配文件中的字符串
    C++有关std::sort和std::bind那些事
    C++有关unordered_map::erase的奇怪bug
    ssh与tar的奇妙组合
    git指定仓库使用特定用户名提交
    在win7下搭建php+apache+mysql环境
    神乎其神的技艺
    好书推荐——《启动大脑》
  • 原文地址:https://www.cnblogs.com/mq0036/p/5656561.html
Copyright © 2011-2022 走看看