function getcsv(){ //csvファイル読み込む関数
    var date = new XMLHttpRequest(); //オブジェクト生成
    date.open("get", "date.csv", true) //csvファイルのパスを指定　データ開く
    date.send(null);
    date.onload = function(){
        convertCSV(date.responseText)
    }
}

function convertCSV(csvdate){
    var deta2 = []; //データを入れるための配列
    var tmp = csvdate.split("\n"); //改行を基準にデータを行ごとで配列化
    for(var i = 0; i < tmp.length; i++){ //各行ごとにカンマで区切った文字列の配列データを生成
        var tmpROW = tmp[i].split(',');
        if(tmpROW !== ''){
            date2[i] = tmp[i].split(',');
        }
    }
    csvHTML(data2); //格納し終えたデータを元に出力
}

function csvHTML(list){
    var outputHTML = '';
    if(list !== undefined){
        outputHTML += '<tabele>'; //最初にテーブル開始タグ挿入
        for(var i = 0; i < list.length; i++){ //行のループ処理
            if(i == 0){
                outputHTML += '<thea>'; //最初の行のときtheadタグ挿入
            }else if(i == 1){
				outputHTML += '<tbody>'; //2行目のときtbodyタグ挿入
            }
            outputHTML += '<tr>'; //trの開始タグ挿入
            for(var j = 0; j < list[i].length; j++){ //1行ごとにループ
                if(i == 0){ //最初の行thタグでデータ挿入
                    outputHTML += '<th scope="col>'+list[i][j]+'</th>';
                }else{
                    if(j == 0){ //2行目以降tdタグでデータ挿入
                        outputHTML += '<th scope="row>'+list[i][j]+'</th>';
                    }else{
                        outputHTML += '<td>'+list[i][j]+'</td>';
                    }
                }    
            }
            outputHTML += '</tr>'; //trの閉じタグ挿入
            if(i == 0){ //最初の行theadの閉じタグ挿入
                outputHTML += '</thead>';
            }else if (i == list.length -1){ //最後の行tbodyの閉じタグ挿入 
                outputHTML += '</tbody>';
            }
        }
        outputHTML += '<table>'; //最後テーブルの閉じタグ挿入
        if($('.outputcsv').length){
            $('.outputcsv').html(outputHTML);
        }
    }
}

getcsv(); //csvファイル読み込み実行