javascript 读取文本文件,js读取文件和写入文件

　　本教程运行环境：windows7系统，javascript1.8.5版本1.8.5，戴尔G3电脑。

　　出于安全和隐私原因，web应用程序不能直接访问用户设备上的文件。如果您需要读取一个或多个本地文件，您可以使用输入文件和FileReader来完成。在本文中，我们将通过一些例子来看看它是如何工作的。

读取文件

　　读取文件，主要使用[FileReader]类。

　　「该对象拥有的属性：」

　　“FileReader.error”:只读，DOMException，表示读取文档时发生的错误。

　　“FileReader.readyState”:表示FileReader状态的只读数字。这些值如下所示：

　　常量值描述EMPTY0尚未加载任何数据。正在加载1数据。DONE2已完成所有读取请求。

　　“FileReader.result”:只读，文档的内容。该属性仅在读取操作完成后有效，数据的格式取决于启动读取操作的方法。

　　「该对象拥有的方法：」

　　reada text(file，encoding):以纯文本形式读取文件，读取的文本保存在result属性中。第二个参数表示编码格式。

　　ReadAsDataUrl(file):读取文件并将其作为数据URI保存在result属性中。

　　ReadAsBinaryString(file):读取文件并将其作为字符串保存在result属性中。

　　ReadAsArrayBuffer(file):读取文件并将包含文件内容的ArrayBuffer保存在result属性中。

　　FileReader.abort():中止读取操作。返回时，readyState属性完成。

　　「文件读取的过程是异步操作，在这个过程中提供了三个事件：progress、error、load事件。」

　　进度：每隔50毫秒左右，就会触发一个进度事件。

　　错误：无法读取文件信息时触发。

　　加载：加载成功后触发。

　　在下面的例子中，我们将使用readAsText和readAsDataURL方法来显示文本和图像文件的内容。

　　例一：读取文本文件

　　为了将文件的内容显示为文本，需要重写更改：

　　首先，我们需要确保有一个可读的文件。如果用户取消或关闭文件选择对话框而没有选择文件，我们就没有要读取的内容并退出该功能。

　　然后，我们继续创建一个文件读取器。reader的工作是异步的，以避免阻塞主线程和UI更新，这在读取大文件(比如视频)时非常重要。

　　Reader发出一个“load”事件(比如一个图像对象)来告诉我们文件已经被读取。

　　将读取器文件的内容保存在其result属性中。这个属性中的数据取决于我们用来读取文件的方法。在我们的示例中，我们使用readAsText方法读取文件，因此结果将是一个文本字符串。

　　例二：显示本地选择的图片

　　如果我们要显示图像，那么将文件作为字符串读取并不是很有用。FileReader有一个readAsDataURL方法，可以将文件读入一个编码的字符串，该字符串可以作为img元素的源。这个示例的代码与前面的代码基本相同，只是我们使用readAsDataURL读取文件并将结果显示为图像：

　　总结

　　1)由于安全和隐私的原因，JavaScript不能直接访问本地文件。

　　2)您可以通过将输入类型设置为文件来选择和处理文件。

　　3)文件输入具有所选文件的files属性。

　　4)我们可以使用FileReader来访问所选文件的内容。

　　【推荐学习：javascript高级教程】以上是JavaScript如何读取文件的细节。更多请关注我们的其他相关文章！

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。