Bagaimana untuk membaca fail teks tempatan dalam html

HTML itu sendiri tidak boleh membaca fail setempat secara langsung, tetapi ia boleh diselesaikan dengan kaedah berikut: Menggunakan API FileReader: Gunakan kaedah readAsText() API FileReader untuk membaca kandungan fail teks. Menggunakan XMLHttpRequest: Gunakan XMLHttpRequest (XHR) untuk menghantar permintaan HTTP kepada pelayan untuk membaca fail setempat. Menggunakan API Ambil: Gunakan API Ambil untuk menghantar permintaan HTTP, serupa dengan XMLHttpRequest, tetapi menyediakan cara yang lebih moden.

Cara membaca fail teks tempatan dalam HTML

HTML itu sendiri tidak boleh mengakses sistem fail tempatan secara langsung. Walau bagaimanapun, kami boleh menyelesaikan masalah ini dengan:

Menggunakan FileReader API

FileReader API menyediakan kaedah readAsText(), yang boleh digunakan untuk membaca kandungan fail teks:

<code class="html"><input type="file" id="file-input">

<script>
  const fileInput = document.getElementById('file-input');
  fileInput.addEventListener('change', (e) => {
    const file = e.target.files[0];
    const reader = new FileReader();
    reader.onload = (e) => {
      const text = e.target.result;
      // 使用 text
    };
    reader.readAsText(file);
  });
</script></code>

Menggunakan An XMLHttpRequest

<code class="html"><script>
  const request = new XMLHttpRequest();
  request.open('GET', 'local-file.txt');
  request.onload = () => {
    const text = request.responseText;
    // 使用 text
  };
  request.send();
</script></code>

Menggunakan Fetch API

<code class="html"><script>
  fetch('local-file.txt')
  .then(response => response.text())
  .then(text => {
    // 使用 text
  })
  .catch(error => {
    // 处理错误
  });
</script></code>

Atas ialah kandungan terperinci Bagaimana untuk membaca fail teks tempatan dalam html. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!