テキスト ファイルを JavaScript 変数にロードするにはどうすればよいですか?

テキスト ファイルの内容を JavaScript 変数にロードする

Web 開発の領域では、さまざまな目的でテキスト ファイルの内容にアクセスすることが必要になることがよくあります。 「JavaScript でこれを簡単に実現するにはどうすればよいですか?」

テキスト ファイルを JavaScript 変数にロードするために、一般に AJAX として知られる XMLHttpRequest の世界を詳しく調べます。実装は使用する JavaScript フレームワークに基づいて若干異なる場合がありますが、互換性の問題を無視した基本的な例は次のようになります。

var client = new XMLHttpRequest();
client.open('GET', '/foo.txt');
client.onreadystatechange = function() {
  alert(client.responseText);
}
client.send();

このコードは、XMLHttpRequest オブジェクト (クライアント) を初期化し、取得するように構成します。 GET メソッドを使用してテキスト ファイル (/foo.txt) の内容を取得します。リクエストが正常に完了すると、onreadystatechange イベント リスナーがトリガーされ、ファイルの内容が client.responseText プロパティに公開されます。典型的な使用例には、示されているように、このテキストをアラート ボックスに表示することが含まれます。

ただし、XMLHttpRequest はすべてのプラットフォームで普遍的にアクセスできるわけではないことに注意してください。このようなシナリオでは、jQuery などの AJAX フレームワークを利用することが現実的な解決策になります。

考慮すべき重要な注意点は、この方法はテキスト ファイル (foo.txt) が同じドメイン上に存在する場合にのみ適用できるということです。クロスドメインリクエストは、セキュリティの脆弱性を防ぐ同一生成元のセキュリティポリシーにより妨げられます。

以上がテキスト ファイルを JavaScript 変数にロードするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。