ホームページ >ウェブフロントエンド >htmlチュートリアル >HTMLでテキストファイルの内容を読み取る方法

HTMLでテキストファイルの内容を読み取る方法

下次还敢
下次还敢オリジナル
2024-04-05 10:33:171404ブラウズ

HTML はテキスト ファイルを読み取ることができませんが、JavaScript を使用して実現できます: fetch() を使用してファイルのコンテンツを取得し、response.text() メソッドを使用してテキストを取得し、その後で読み取り応答を処理します。 () 方法。

HTMLでテキストファイルの内容を読み取る方法

HTML を使用してテキスト ファイルの内容を読み取る方法

HTML 自体では、テキスト ファイルの内容を直接読み取ることはできません。テキストファイル。ただし、この機能は JavaScript を使用して簡単に実装できます。

方法:

テキスト ファイルの内容を読み取るには、次の JavaScript 関数を使用できます:

<code class="javascript">fetch('textfile.txt')
  .then(response => response.text())
  .then(data => {
    // 对读取到的文本文件内容进行处理
  });</code>

手順:

  • fetch() この関数は、サーバーからリソース (テキスト ファイル) を取得するために使用されます。
  • response.text() このメソッドは、テキスト ファイルのテキスト コンテンツを返します。
  • then() メソッドは、テキスト ファイルの読み取りに成功した後の応答を処理するために使用されます。

例:

次に、テキスト ファイルの内容を読み取り、Web ページに表示する HTML コードの例を示します。

<code class="html"><html>
<head>
  <script>
    fetch('textfile.txt')
      .then(response => response.text())
      .then(data => {
        document.getElementById('content').innerHTML = data;
      });
  </script>
</head>
<body>
  <div id="content"></div>
</body>
</html></code>
この例では、

  • textfile.txt は、読み取るテキスト ファイルです。
  • content は、読み取られたテキスト ファイルのコンテンツを含む HTML 要素です。

以上がHTMLでテキストファイルの内容を読み取る方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。