使用javascript向html表中添加新列_Javascript_Html

使用javascript向html表中添加新列

javascript html

使用javascript向html表中添加新列,javascript,html,Javascript,Html,因此，我收集了一些数据并将其保存到CSV文件中。我不想把这些数据呈现在html页面上。因为保存的数据只有两列（项目名称和价格），所以它只显示这两列我想在它旁边添加另一列，这样我就可以在里面有一个“Addtobasket”按钮。我不知道如何才能在这里添加新列有人能帮忙吗？多谢各位 <body>  <div id="header"> <button type="button" class="

因此，我收集了一些数据并将其保存到CSV文件中。我不想把这些数据呈现在html页面上。因为保存的数据只有两列（项目名称和价格），所以它只显示这两列

我想在它旁边添加另一列，这样我就可以在里面有一个“Addtobasket”按钮。我不知道如何才能在这里添加新列

有人能帮忙吗？多谢各位

 <body>

<!--     Header-->
     <div id="header"> 
      <button type="button" class="button">Basket</button>
     </div>

<!--     CSV FILE DATA WILL APPEAR HERE-->
  <div class="container">
   <div class="table-responsive">
    <div id="order_list"><p id="tableintro"> Choose your desired supermarket</p>
    </div>
   </div>
  </div>    

<!--THIS BUTTON WILL LOAD DATA FROM CSV FILE-->
<div id="sidebar">
         <div align="center">
 <button type="button" name="load_data" id="load_data" class="btn btn-info">Tesco Brent Cross</button>
    </div>
     </div>




<!--Javascript code for Tesco-->

<script>
$(document).ready(function(){
 $('#load_data').click(function(){
  $.ajax({
   url:"Tesco.csv",
   dataType:"text",
   success:function(data)
   {
    var tesco_data = data.split(/\r?\n|\r/);
    var table_data = '<table class="table table-bordered table-striped">';
    for(var count = 0; count<tesco_data.length; count++)
    {
     var cell_data = tesco_data[count].split(",");
     table_data += '<tr>';
     for(var cell_count=0; cell_count<cell_data.length; cell_count++)
     {
      if(count === 0)
      {
       table_data += '<th>'+cell_data[cell_count]+'</th>';
      }
      else
      {
       table_data += '<td>'+cell_data[cell_count]+'</td>';
      }
     }
     table_data += '</tr>';
    }
    table_data += '</table>';
    $('#order_list').html(table_data);
   }
  });
 });

});
</script>


篮子
选择您想要的超市
特易购布伦特十字车站
$（文档）.ready（函数（）{
$（“#加载_数据”）。单击（函数（）{
$.ajax({
网址：“Tesco.csv”，
数据类型：“文本”，
成功：功能（数据）
{
var tesco_data=data.split（/\r？\n | \r/）；
var表_数据=“”；
对于（var count=0；count装载表时遇到格式问题。在这种情况下，如果每行只有两个单元格，则第二个for循环似乎是一种过度使用。请尝试使用此循环替换for循环：
    for (var count = 0; count < tesco_data.length; count++)
    {
     var cell_data = tesco_data[count].split(",");
     var name = cell_data[0];
     var price = cell_data[1];

      if (count === 0)
      {
       table_data += '<tr><th>' + name + '</th><th>' + price + '</th><th>action</th></tr>';
       continue;
      }

     table_data += '<tr><td>' + name + '</td><td>' + price + '</td><td><button type="button">Add to cart</button></td></tr>';
    }

for（var count=0；count
不要添加
，而是添加blabla
。似乎很简单？只需区分第一行标题行。这似乎不起作用…只需更新问题，以显示您实际尝试了什么，它提供了什么输出，以及如何不满足您的期望。@RamgithUnniJagajith我添加了一个答案，但编辑了meanwhile…请测试我答案的最新版本，并让我知道这是否奏效；）