ExcelやスプレッドシートのCSVコピペをTable形式のHTMLに変換する

Excelやスプレッドシートから範囲コピペしてボタンを押してください

インデントは半角スペースx2です必要ならば適当にタブなどに置換してください


  view source
  JavaScript
  $(function(){
  $('#go').on('click', function(){
    var csv = $('#input').val();
    var table = csv2table(csv)
    $('#output').val(table);
  });
});

function csv2table(csv){
  var table = '';
  var ary= [];
  var sp = '  ';
  var lines = csv.split("\n");
  ary.push('<table>');
  ary.push(sp+'<tbody>');
  lines.forEach(function(line, index){
    var row = line.split("\t");
    ary.push(sp+sp+'<tr>');
    row.forEach(function(v){
      var tds = '<td>';
      var tde = '</td>';
      if(index===0){
        tds = '<th>';
        tde = '</th>';
      }
      var vv = sp+sp+sp+tds+v+tde;
      ary.push(vv);
    });
    ary.push(sp+sp+'</tr>');
  });
  ary.push(sp+'</tbody>');
  ary.push('</table>');
  table = ary.join("\n");
  return table;
}

  CSS
  textarea{
  width:100%;
  height:240px;
  background-color:#eeeeee;
  border:1px solid #000000;
  box-sizing:border-box;
}
textarea.drag{
  background-color:#ee9999;
}
  HTML
  
    ページのソースを表示 : Ctrl+U , DevTools : F12
    view-source:https://hi0a.com/demo/-js/js-csv-to-table-html/
  
  ABOUT
  
    hi0a.com 「ひまアプリ」は無料で遊べるミニゲームや便利ツールを公開しています。
    プログラミング言語の動作デモやWEBデザイン、ソースコード、フロントエンド等の開発者のための技術を公開しています。
    必要な機能の関数をコピペ利用したり勉強に活用できます。
    プログラムの動作サンプル結果は画面上部に出力表示されています。
    環境:最新のブラウザ GoogleChrome / Windows / Android / iPhone 等の端末で動作確認しています。
    画像素材や音素材は半分自作でフリー素材配布サイトも利用しています。LINK参照。
    動く便利なものが好きなだけで技術自体に興味はないのでコードは汚いです。
    途中放置や実験状態、仕様変更、API廃止等で動かないページもあります。