Panduan ringkas untuk membaca fail teks dalam HTML

Buat objek XMLHttpRequest, tetapkan permintaan dan dengar acara sedia respons melalui JavaScript untuk membaca fail teks dalam HTML. Dalam kes praktikal, dengan mencipta fail teks dan menambah kod HTML, kandungan fail teks boleh dikeluarkan kepada elemen yang ditentukan pada halaman.

Panduan ringkas untuk membaca fail teks dalam HTML

Pengenalan:
Membaca fail teks dalam HTML adalah penting untuk memaparkan kandungan halaman web atau berinteraksi dengan data luaran. Artikel ini akan menyediakan panduan langkah demi langkah tentang cara membaca fail teks dengan mudah menggunakan JavaScript.

Blok kod:

// 创建一个 XMLHttpRequest 对象
const xhr = new XMLHttpRequest();

// 打开一个 GET 请求
xhr.open('GET', 'path/to/textfile.txt', true);

// 设置请求类型
xhr.setRequestHeader('Content-Type', 'text/plain');

// 监听响应就绪事件
xhr.onload = function() {
  // 检查请求状态
  if (xhr.readyState === 4 && xhr.status === 200) {
    // 获得文本文件内容
    const text = xhr.responseText;
    
    // 将文本文件内容输出到页面
    document.getElementById('result').innerHTML = text;
  }
};

// 发送请求
xhr.send();

Kes praktikal:

Andaikan kita mempunyai fail teks bernama content.txt yang mengandungi teks berikut: "Hello World!". Sekarang, kami mahu memaparkan teks ini ke dalam halaman web dengan ID elemen HTML hasil. content.txt 的文本文件，其中包含以下文本：“Hello World!”。现在，我们想将此文本显示到具有 HTML 元素 ID 为 result 的网页中。

步骤:

1. 创建一个 content.txt 文件并保存文本“Hello World！”。
2. 在 HTML 页面中添加以下代码：

<div id="result"></div>
<script>
  // 执行读取文本文件的代码块
</script>

3. 在浏览器中打开该 HTML 页面，文本“Hello World!”会显示在 #result

Langkah:

1. Buat fail content.txt dan simpan teks "Hello World!".

Tambah kod berikut dalam halaman HTML:

rrreee

3. Buka halaman HTML dalam penyemak imbas, teks "Hello World!" hasil elemen. 🎜🎜🎜Kesimpulan:🎜🎜🎜Panduan ini menunjukkan cara mudah membaca fail teks dalam HTML menggunakan JavaScript. Dengan mengikuti langkah dan contoh ini, anda boleh memuatkan data luaran dengan mudah ke dalam halaman web anda. 🎜

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