2011|08|
2013|10|11|12|
2014|01|02|03|04|05|06|07|08|09|10|11|12|
2015|01|02|03|05|06|07|08|09|10|11|12|
2016|01|03|04|05|06|07|08|09|10|11|12|
2017|01|02|03|04|05|06|07|08|09|10|11|12|
2018|01|02|03|04|05|06|07|08|09|10|11|12|
2019|01|02|03|04|05|06|07|08|09|10|11|12|
2020|01|02|03|04|

2019-05-28 htmlでcsvファイルを読み込む [長年日記]

htmlでcsvファイルを読み込む

chromoの右上アイコン→その他のツール→ディベロッパーツール→Consoleに出力される

<form name="test">
<input type="file" id="selfile"><br>
<textarea name="txt" rows="10" cols="50" readonly></textarea>
</form>
 
<script>
var obj1 = document.getElementById("selfile");
 
//ダイアログでファイルが選択された時
obj1.addEventListener("change",function(evt){
 
  var file = evt.target.files;
 
  //FileReaderの作成
  var reader = new FileReader();
 
  //テキスト形式で読み込む
  reader.readAsText(file[0]);
 
  //読込終了後の処理
  reader.onload = function(ev){
    //テキストエリアに表示する
    document.test.txt.value = reader.result;
    console.log( reader.result.split('\n') );
 
    var lineArr = reader.result.split("\n");           
    //行と列の二次元配列にする
    var itemArr = [];
     for (var i = 0; i < lineArr.length; i++) {
       itemArr[i] = lineArr[i].split(",");
     }
     console.log( itemArr ); // chromoの右上アイコン→その他のツール→ディベロッパーツール→Consoleに出力される
 
     var dummy = Number(itemArr[1][2]); // 1行目2列目の数字を取り出す
     console.log(dummy);
 
    }
},false);
</script>
syntax2html