1. 面向开发者的 Web 技术
  2. Web API
  3. FileReader
  4. FileReader：readAsText() 方法

此页面由社区从英文翻译而来。了解更多并加入 MDN Web Docs 社区。

View in English Always switch to English

FileReader：readAsText() 方法

基线 广泛可用

自 2015年7月 起，此特性已在主流浏览器中得到支持，可在大多数设备和浏览器版本中正常使用。

备注： 此特性在 Web Worker 中可用。

FileReader 接口的 readAsText() 方法用于读取指定的 Blob 或 File 对象的内容。当读操作完成时，readyState 属性更改为 DONE，并触发 loadend 事件，并且 result 属性包含表示文件内容的文本字符串。

备注：Blob.text() 方法是一种较新的基于 Promise 的 API，用于将文件读取为文本。

备注：该方法将整个文件的内容加载到内存中，不适合大文件。对于大文件，首选使用 readAsArrayBuffer()。

语法

js
readAsText(blob)
readAsText(blob, encoding)

参数

blob

从中读取的 Blob 或 File 对象。

encoding 可选

指定用于返回数据的编码的字符串。如果未指定此参数，则默认情况下假定为 UTF-8。

返回值

无（undefined）。

示例

HTML

html
<input type="file" onchange="previewFile()" /><br />
<p class="content"></p>

JavaScript

js
function previewFile() {
  const content = document.querySelector(".content");
  const [file] = document.querySelector("input[type=file]").files;
  const reader = new FileReader();

  reader.addEventListener(
    "load",
    () => {
      // 然后这将显示一个文本文件
      content.innerText = reader.result;
    },
    false,
  );

  if (file) {
    reader.readAsText(file);
  }
}

结果

规范

规范
File API
# readAsDataText

浏览器兼容性

参见

帮助改进 MDN

了解如何参与贡献

此页面最后更新于 ，由 MDN 贡献者更新。

在 GitHub 上查看此页面 • 报告此内容的问题