创建股票报价器的Javascript表格

Question

我想获得一个Javascript股票代码工作，它进展顺利，但我的JavaScript的知识是在初学者水平 - 但我正在学习！

• 当前代码使用google finance API提取实时股票数据。
• 它检查看股票简称和打印完整的公司名称
• ，并有一些不同的造型

我试图做到的是让股票数据列中打印出来，我不能似乎这样做在HTML中，并在看着Javascript表后，我认为这需要被写为Javascript。

我需要创建3列; 1为股票名称，例如（HAULOTTE），一个用于股票交易，例如（PIG），另一个用于股票数据。这将确保每个库存数据行与其上下的数据行保持平行。

附件是当前的jsfiddle：

https://jsfiddle.net/feq3L57p/

var gstock = ["EPA:PIG","LON:AHT","NYSE:URI","NYSE:TEX" ,"NYSE:CAT", "NASDAQ:HEES", "NASDAQ:MNTX", "VIE:PAL" ]; 
$(document).ready(function() { 
     for (var i = 0; i < gstock.length; i++) { 
     $.getJSON("https://finance.google.com/finance/info?client=ig&q="+gstock[i]+"&callback=?", function (response) { 
      var stockInfo1 = response[0]; 
      var divContainer = $('*[data-symbol="' + stockInfo1.t +'"]'); 

      var stockString1 = '<div class="stockWrapper">' + divContainer.data('title') + ':'; 
      var stockName1 = stockInfo1.t;    
      stockString1 += '<span class="stockSymbol "> ' + stockInfo1.t + ' </span>'; 
      stockString1 += '<span class="stockPrice "> ' + stockInfo1.l + '</span>'; 
      stockString1 += '<span class="stockChange "> ' + stockInfo1.c + '</span>'; 
      stockString1 += '</div>'; 
      divContainer.append(stockString1); 

     }); 
    } 
}); 

Answer 1

这是一个基本列的例子，应该让你对你的方式。它仿效我能理解你所要求的符号。总体思路：嵌套div s，设置列width，并使用float: left为合适的容器div s。

HTML：

<div class="box"> 
<div class="floatleft2 " style="padding:5px;"> 
    <div>Stock Name Info</div> 
    <div>Stock Name Info</div> 
    <div>Stock Name Info</div> 
    <div>Stock Name Info</div> 
</div> 
<div class="floatleft2" style="padding:5px;"> 
    <div>Symbol Info</div> 
    <div>Symbol Info</div> 
    <div>Symbol Info</div> 
    <div>Symbol Info</div> 
</div> 
<div class="floatleft2" style="padding:5px;"> 
    <div>Figure Info</div> 
    <div>Figure Info</div> 
    <div>Figure Info</div> 
    <div>Figure Info</div> 
</div> 
</div> 

CSS：

.box {width:800px; margin:auto; } 
.floatleft2 {float: left; width: 150px; margin:5px; }