javaScript

javascriptでテキストファイルやCSVファイルを読み込む方法。

javascriptでテキストファイルやCSVファイルを読み込む方法は下記になります。
この他に、jqueryだとajaxを使用して読み込む方法などもありますが、あえて
javascriptで記述しています。

rt();
function rt(){
    var xmlHttp = new XMLHttpRequest();
    xmlHttp.open("GET","xxx.txt",true);
    xmlHttp.send(null);
    xmlHttp.onload = function(){
        var data = xmlHttp.responseText;
    }
}

追記:アクセス数が結構あるのでサンプルを作りました。
下記のコードをお試しください。
デモページはこちらになります。
https://zip358.com/tool/demo13/

"use strict";
var csv = {
    load: function (filename, id) {
        var data = {};
        var xmlHttp = new XMLHttpRequest();
        xmlHttp.open("GET", filename, true);
        xmlHttp.send(null);
        xmlHttp.onload = function () {
            if (xmlHttp.status === 200) {
                let separate1 = /\r\n/;
                let separate2 = ",";
                let data_org = xmlHttp.responseText;
                let data_en = data_org.split(separate1);
                for (let d in data_en) {
                    data[d] = data_en[d].split(separate2);
                }
                //data load 
                var t = document.getElementById(id);
                var h = "<table>";

                for (var o in data) {

                    h += "<tr>";
                    for (var r in data[o]) {
                        h += "<td>";
                        h += data[o][r].slice(1, -1);
                        h += "</td>";
                    }
                    h += "</tr>";
                }
                h += "</table>";
                t.innerHTML = h;
            }
        };
    }
};

csv.load("xxx.csv", "table");


The following two tabs change content below.
taokaと申します。 まったりWEB日誌を更新している中の人です? 趣味は映画鑑賞とブログ書きです、 こちらで生活できるようになるのが目標です。 ブックマークやシェアして頂けると励みになります。 どうぞよろしくお願い致します。

関連記事

  1. PHP

    一時間に一回だけAPIを実行するPHPのオブジェクトファイル

    あるユーザーが公開しているプログラミングを参考にしてオブジェ…

  2. PHP

    PHPでバインドするこれでSQLの脆弱性が!?

    上記の画像では脆弱性がある。PHPでバインドするこれで…

  3. javaScript

    Canvasで円がぐるぐる回る。

    &lt;!DOCTYPE html&gt;&lt;html&g…

  4. javaScript

    楽天RMSの禁止タグ制限を突破サービス!?

    楽天RMSの禁止タグ制限を突破サービスを自前してみました。…

  5. jquery

    jqueryのイベント処理時に引数を受け渡す方法を知っとくと良いかもしれません。

    jqueryのイベント処理時に引数を受け渡す方法を知っとくと…

2018年11月
 1234
567891011
12131415161718
19202122232425
2627282930 

アクセスカウンター😅

とある高知県の気温や湿度

Twitter でフォロー

PAGE TOP