html读取在线文件,javascript中如何读取文件？

javascript中可以如何读取文件？下面本篇文章就来给大家介绍一下在javascript中读取文件的方法，希望对大家有所帮助。

因为JavaScript中的Web API有了新的方法File API，所以我们在浏览器上读取文件并处理数据更加方便而且不需要使用到后端服务器。

FileReader就是从一个文件中读取数据并存储在一个JavaScript变量中，它与XMLHttpRequest含义差不多，都是从一个外部资源加载数据而且读操作是异步的，这样的好处是不会使浏览器堵塞。

它读取操作的方法有多种多样的，例如以下几种方法：

(1)readAsText() – 以纯文本的形式返回文件内容

该readAsText()方法可用于读取文本文件。该方法有两个参数。第一个参数是用于File或Blob要被读取的对象。第二个参数用于指定文件的编码。第二个参数是可选的。如果未指定，UTF-8则默认采用编码。

在设置中需要在文件加载完成后设置一个事件监听器。onload调用事件时，我们可以检查result属性FileReader所获取文件的内容。

var file=document.getElementById("file");

var reader = new FileReader();

reader.οnlοad=function(e){

var text=reader.result;

}

reader.readAsText(file);

(2)readAsArrayBuffer() 方法

该方法将读取一个Blob或一个File对象并生成一个ArrayBuffer。当读取操作完成时，readyState 变成 done(已完成)，并触发 loadend 事件，同时 result 属性中将包含一个 ArrayBuffer 对象用以表示所读取文件的数据，ArrayBuffer 是固定长度的二进制数据缓冲区。

在操作文件时比如将JPEG图像转换为PNG。

var file=document.getElementById("file");

var reader = new FileReader();

reader.οnlοad=function(e){

var readAsArrayBuffer=reader.result;

}

reader.readAsArrayBuffer(file);

(3)readAsDataURL() 使用数据URL的形式返回文件内容

该方法接受File或Blob生成数据URL，这基本上是文件数据的base64编码字符串可以将此数据URL用于设置src图像属性等内容

var file=document.getElementById("file");

var reader = new FileReader();

reader.οnlοad=function(e){

var dataURL = reader.result;

}

reader.readAsDataURL(file);

上面的三种方法在使用过程中要在开始读取之前，必须监听load事件，而event.target.result是返回读取的结果。

html读取在线文件,javascript中如何读取文件？相关推荐

可视化webpart基础开发——TreeView控件读取文档库中的所有文件夹和文件（递归方法读取） ....
可视化webpart基础开发--TreeView控件读取文档库中的所有文件夹和文件(递归方法读取) 作者:miragesky2049 原文地址:http://blog.csdn.net/mirages ...
r读取文件夹下的所有csv文件_[R语言]读取文件夹下所有子文件夹中的excel文件，并根据分类合并。...
解决的问题:需要读取某个大文件夹下所有子文件夹中的excel文件,并汇总,汇总文件中需要包含的2部分的信息:1.该条数据来源于哪个子文件夹:2.该条数据来源于哪个excel文件.最终,按照子文件夹单独 ...
python找到文件夹下指定文件类型_python 读取指定文件夹中的指定文件类型的文件名...
C# 读取指定文件夹中的全部文件,并按规则生成SQL语句! 本实例的目的在于: 1 了解怎样遍历指定文件夹中的全部文件 2 控制台怎样输入和输出数据代码: using System; using S ...
java读取某个文件夹中的全部文件(包括子文件夹)
主要思路使用file.listFiles()函数可以获取到某文件夹下的所有文件信息,如果需要访问子文件夹下的文件,则需要对获取到的文件信息进行递归遍历,如果是目录则继续统计,如果是文件则加入文件列表 ...
Unity C# 读取安卓persistentDataPath目录中的json文件
一.声明需要用到的命名空间 using LitJson; //用于读取Json文件 using System.IO; //用于声明StreamReader类 ...
你必须具有权限才能读取此对象_win10中随心所欲设置文件/文件夹访问权限，可以轻松做到，并不难...
要访问Windows 10上的任何文件或文件夹,你必须具有相应的权限.遗憾的是,如果你没有编辑某些文件和文件夹的权限,则可能会出现某些问题,这时你必须对该文件夹或文件取得所有权. 要想取得某个文件夹的 ...
C++ 如何将一个文件夹中的所有文件（.txt或者.log）内容整合到一个文件（.txt或者.log）当中
有时候我们希望读取一个文件夹中的所有文件,对各个文件中的数据按某种规则进行筛选,然后将筛选后的数据整合到一个文件中.这段时间正好替同事写了这一部分,在此记录下来自己的处理过程,如果有需要的朋友也可以参 ...
【java】删除文件夹及文件夹中的所有文件
需求删除指定文件夹及文件夹中的所有文件. 环境 JDK 1.8 代码示例在JDK 8中,可以使用java.nio.file.Files和java.nio.file.Path类来删除一个文件夹及其中 ...
服务器所有文件,检索服务器端文件夹中的所有文件
我有以下C#方法,该方法检索文件夹中的所有文件,并在asp.net应用程序中使用,并通过JavaScript进行AJAX调用来调用: public string GetSoundFile(string ...
LOST.DIR文件夹中意外丢失文件的恢复方法
LOST.DIR文件夹中意外丢失文件的恢复方法 LOST.DIR文件夹中意外丢失文件的恢复方法 http://moto.it168.com/thread-750593-1-1.html 玩了一段时间A ...

html读取在线文件,javascript中如何读取文件？

html读取在线文件,javascript中如何读取文件？相关推荐

最新文章

热门文章