如何將標題添加到動態構建的表中？

Question

點擊鋰標籤，我使用YQL並獲取與其相關的數據。

可否請你讓我知道如何我可以添加標題，以表作爲以這種方式

名稱，最新價格，變化，最後更新

我的代碼一些部分

if (DaysLow) 
       { 
    htmldata += '<tr>\ 
    <td>' + Name + '</td>\ 
    <td>' + LastTradePriceOnly + '</td>\ 
    <td>' + Change + '</td>\ 
    <td>' + ChangeinPercent + '</td>\ 
    <td>' + LastTradeTime + '</td>\ 
    </tr>'; 
       } 
      } 
     }); 

https://jsfiddle.net/24qgtfyw/1/

Answer 1

u需要啓動您的

htmldata = '<table><thead><th>Name</th><th>Last Price</th><th>Change</th><th>Last Updated</th></thead><tbody>'; 

if (DaysLow) 
       { 
    htmldata += '<tr>\ 
    <td>' + Name + '</td>\ 
    <td>' + LastTradePriceOnly + '</td>\ 
    <td>' + Change + '</td>\ 
    <td>' + ChangeinPercent + '</td>\ 
    <td>' + LastTradeTime + '</td>\ 
    </tr>'; 
       } 
      } 
     }); 

htmldata += '</tbody></table>'; 

這裏的fiddle

Answer 2

您之前添加下面的代碼行for loop範圍

htmldata += '<thead><th>Name</th><th>Last Price</th><th>Change</th><th>Last Updated</th></thead><tbody>'; 

而且for loop範圍

htmldata += '</tbody>'; 

jQuery("ul.tabs-1 li").click(function() { 
 
     fetchDataForGlobalIndices('#tab-1-1'); 
 
    }); 
 
    var asia_symbols = ["%5EAORD", "%5ETWII"]; 
 

 
    function fetchDataForGlobalIndices(clickedtab) { 
 
     if (clickedtab === '#tab-1-1') { 
 
      fetchJSONFromYQL(asia_symbols, clickedtab); 
 
     } 
 
    } 
 

 
    function fetchJSONFromYQL(symbolsarray, clickedtab) { 
 
     var htmldata = ''; 
 
     var promises = []; 
 
     
 
     htmldata += '<thead><th>Name</th><th>Last Price</th><th>Change</th><th>Last Updated</th></thead><tbody>'; 
 
     
 
     for (var i = 0; i < symbolsarray.length; i++) { 
 
      var symbol = symbolsarray[i].trim(); 
 
      var query = "select * from yahoo.finance.quotes where symbol = " + "'" + symbol + "'"; 
 
      var yql = "https://query.yahooapis.com/v1/public/yql?q=" + escape(query) + "&format=json&diagnostics=false&env=store://datatables.org/alltableswithkeys&callback=?"; 
 
      var request = $.ajax({ 
 
       url: yql, 
 
       dataType: 'json', 
 
       async: false, 
 
       timeout: 4000, 
 
       success: function (data) { 
 
        var DaysLow = data.query.results.quote.DaysLow; 
 
        var DaysHigh = data.query.results.quote.DaysHigh || DEFAULT; 
 
        var ChangeinPercent = data.query.results.quote.ChangeinPercent || DEFAULT; 
 
        var Name = data.query.results.quote.Name || DEFAULT; 
 
        var LastTradeTime = data.query.results.quote.LastTradeTime || DEFAULT; 
 
        var LastTradePriceOnly = data.query.results.quote.LastTradePriceOnly || DEFAULT; 
 
        var Change = data.query.results.quote.Change || DEFAULT; 
 
        if (DaysLow) { 
 
         htmldata += '<tr>\ 
 
    <td>' + Name + '</td>\ 
 
    <td>' + LastTradePriceOnly + '</td>\ 
 
    <td>' + Change + '</td>\ 
 
    <td>' + ChangeinPercent + '</td>\ 
 
    <td>' + LastTradeTime + '</td>\ 
 
    </tr>'; 
 
        } 
 
       } 
 
      }); 
 
      promises.push(request); 
 
     } 
 
     htmldata += '</tbody>'; 
 
     jQuery.when.apply(null, promises).done(function() { 
 
      jQuery(clickedtab).html(htmldata); 
 
      promises.length = 0; 
 
      promises = []; 
 
      htmldata = ''; 
 
     }) 
 
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 
<div class=""> 
 
    <h5 class="element-title">Global Indices</h5> 
 

 
    <div class="list-container-1"> 
 
     <ul class="tabs-1 clearfix"> 
 
      <li><a href="#tab-1-1">ASIA </a> 
 
      </li> 
 
     </ul> 
 
     <!--tabs-1--> 
 
    </div> 
 
    <!--list-container-1--> 
 
    <div class="tab-container-1"> 
 
     <table id="tab-1-1" class="tab-content-1 table table-striped"></table> 
 
     <!--tab-content-1--> 
 
    </div> 
 
    <!--tab-container-1--> 
 
</div> 
 
<!--end:kopa-one-two-->

後添加下面一行

https://jsfiddle.net/kishoresahas/24qgtfyw/4/