HTML5新增了关于文件的File，FileReader两个对象，用于获取文件信息和读取文件信息。
var
fileInput = documentgetElementById('test-image-file'),
info = documentgetElementById('test-file-info'),
preview = docementgetElementById('test-image-preview');
//监听change事件
fileInputaddEventListener('change', function() {
//清除背景
previewstylebackgroundImage = '';
//检查文件是否选择
if(!fileInputvalue) {
infoinnerHTML = '没有选择文件';
return;
}
//获取file文件引用：
var file = fileInputfiles[0];
//获取文件信息
infoinnerHTML = '文件：' + filename + '<br>' +
'大小：' + filesize + '<br>' +
'修改：' + filelastModifiedDate;
if(filetype !== 'image/jpeg' && filetype !== 'image/png' && filetype !== 'image/gif') {
alert('不是有效的文件');
return;
}
//读取文件
var reader = new FileReader();
readeronload = function(e) {
var data = etargetresult;
previewstylebackgroundImage = 'url('+ data + ')';
};
//以DataURL的形式读取文件：
readerreaderAsDataURL(file);
})
利用JS获取URL地址，估计你的意思也就是说这个地址是没有文件的，就类似于写博客，两个地址都能够访问到，只是想让目录形式跳转到404页面，是吧。可以写个js脚本，或者用php的ifelse写，但是注意下php在html文件注释的内容。
JS读写文件，分别如下：
//读文件
function readFile(filename){
var fso = new ActiveXObject("ScriptingFileSystemObject");
var f = fsoOpenTextFile(filename,1);
var s = "";
while (!fAtEndOfStream)
s += fReadLine()+"\n";
fClose();
return s;
}
//读文件
function readFile(filename){
var fso = new ActiveXObject("ScriptingFileSystemObject");
var f = fsoOpenTextFile(filename,1);
var s = "";
while (!fAtEndOfStream)
s += fReadLine()+"\n";
fClose();
return s;
}
//写文件
function writeFile(filename,filecontent){
var fso, f, s ;
fso = new ActiveXObject("ScriptingFileSystemObject");
f = fsoOpenTextFile(filename,8,true);
fWriteLine(filecontent);
fClose();
alert('ok');
}
//fileupload对象是文本框类标签出现时候就会被创建出来
//获取上传文件的文件名其实就是获取文本框type为file中的value，虽然这个value一般来说是只读
//下面贴代码
<!DOCTYPE <html>
<head>
<title></title>
<meta ;
//测试结果
需要准备的材料分别有：电脑、html编辑器、浏览器。
1、首先，打开html编辑器，新建html文件，例如：indexhtml。
2、在indexhtml中的<script>标签，输入js代码：var a = locationhrefsplit('/');documentbodyinnerText = a[alength - 1];。
3、浏览器运行indexhtml页面，此时成功获取到当前页面文件名indexhtml并打印了出来。
js获取本地文件夹下的文件
一、功能实现核心：FileSystemObject 对象
要在javascript中实现文件 *** 作功能，主要就是依靠FileSystemobject对象。
二、FileSystemObject编程
使用FileSystemObject 对象进行编程很简单，一般要经过如下的步骤： 创建FileSystemObject对象、应用相关方法、访问对象相关属性 。
（一）创建FileSystemObject对象
创建FileSystemObject对象的
代码只要1行：
var fso = new ActiveXObject("ScriptingFileSystemObject");上述代码执行后，fso就成为一个FileSystemObject对象实例。
（二）应用相关方法
创建对象实例后，就可以使用对象的相关方法了。比如，使用CreateTextFile方法创建一个文本文件：
var fso = new ActiveXObject("ScriptingFileSystemObject");var f1 = fsocreatetextfile("c:\myjstesttxt",true");
（三）访问对象相关属性
要访问对象的相关属性，首先要建立指向对象的句柄，这就要通过get系列方法实现：GetDrive负责获取驱动器信息，GetFolder负责获取文件夹信息，GetFile负责获取文件信息。比如，指向下面的代码后，f1就成为指向文件c: esttxt的句柄：
var fso = new ActiveXObject("ScriptingFileSystemObject");var f1 = fsoGetFile("c:\myjstesttxt");
然后，使用f1访问对象的相关属性。比如：
var fso = new ActiveXObject("ScriptingFileSystemObject");var f1 = fsoGetFile("c:\myjstesttxt");
alert("File last modified: " + f1DateLastModified);
执行上面最后一句后，将显示c:myjstesttxt的最后修改日期属性值。
但有一点请注意：对于使用create方法建立的对象，就不必再使用get方法获取对象句柄了，这时直接使用create方法建立的句柄名称就可以：
var fso = new ActiveXObject("ScriptingFileSystemObject");var f1 = fsocreatetextfile("c:\myjstesttxt",true");
alert("File last modified: " + f1DateLastModified);
三、 *** 作驱动器（Drives）
使用FileSystemObject对象来编程 *** 作驱动器（Drives）和文件夹（Folders）很容易，这就象在Windows文件浏览器中对文件进行交互 *** 作一样，比如：拷贝、移动文件夹，获取文件夹的属性。
（一）Drives对象属性
Drive对象负责收集系统中的物理或逻辑驱动器资源内容，它具有如下属性：
l TotalSize：以字节（byte）为单位计算的驱动器大小。
l AvailableSpace或FreeSpace：以字节（byte）为单位计算的驱动器可用空间。
l DriveLetter：驱动器字母。
l DriveType：驱动器类型，取值为：removable（移动介质）、fixed（固定介质）、network（网络资源）、CD-ROM或者RAM盘。
l SerialNumber：驱动器的系列码。
l FileSystem：所在驱动器的文件系统类型，取值为FAT、FAT32和NTFS。
l IsReady：驱动器是否可用。
l ShareName：共享名称。
l VolumeName：卷标名称。
l Path和RootFolder：驱动器的路径或者根目录名称。
（二）Drive对象 *** 作例程
下面的例程显示驱动器C的卷标、总容量和可用空间等信息：
var fso, drv, s ="";fso = new ActiveXObject("ScriptingFileSystemObject");
drv = fsoGetDrive(fsoGetDriveName("c:\"));
s += "Drive C:" + " - ";
s += drvVolumeName + " ";
s += "Total Space: " + drvTotalSize / 1024;
s += " Kb" + " ";
s += "Free Space: " + drvFreeSpace / 1024;
s += " Kb" + " ";
alert(s);
四、 *** 作文件夹（Folders）
涉及到文件夹的 *** 作包括创建、移动、删除以及获取相关属性。
Folder对象 *** 作例程 :
下面的例程将练习获取父文件夹名称、创建文件夹、删除文件夹、判断是否为根目录等 *** 作：
var fso, fldr, s = "";
// 创建FileSystemObject对象实例
var fso, fldr, s = "";
// 创建FileSystemObject对象实例
fso = new ActiveXObject("ScriptingFileSystemObject");
// 获取Drive 对象
fldr = fsoGetFolder("c:\");
// 显示父目录名称
alert("Parent folder name is: " + fldr + " ");
// 显示所在drive名称
alert("Contained on drive " + fldrDrive + " ");
// 判断是否为根目录
if (fldrIsRootFolder)
alert("This is the root folder");
else
alert("This folder isn't a root folder");
alert(" ");
// 创建新文件夹
fsoCreateFolder ("C:\Bogus");
alert("Created folder C:\Bogus" + " ");
// 显示文件夹基础名称，不包含路径名
alert("Basename = " + fsoGetBaseName("c:\bogus") + " ");
// 删除创建的文件夹
fsoDeleteFolder ("C:\Bogus");
alert("Deleted folder C:\Bogus" + " ");
五、 *** 作文件（Files）
对文件进行的 *** 作要比以上介绍的驱动器（Drive）和文件夹（Folder） *** 作复杂些，基本上分为以下两个类别：对文件的创建、拷贝、移动、删除 *** 作和对文件内容的创建、添加、删除和读取 *** 作。下面分别详细介绍。
（一）创建文件
一共有3种方法可用于创建一个空文本文件，这种文件有时候也叫做文本流（text stream）。
第一种是使用CreateTextFile方法。代码如下：
var fso, f1;
fso = new ActiveXObject("ScriptingFileSystemObject");
f1 = fsoCreateTextFile("c:\testfiletxt", true);
第二种是使用OpenTextFile方法，并添加上ForWriting属性，ForWriting的值为2。代码如下：
var fso, ts;
var ForWriting= 2;
fso = new ActiveXObject("ScriptingFileSystemObject");
ts = fsoOpenTextFile("c:\testtxt", ForWriting, true);
第三种是使用OpenAsTextStream方法，同样要设置好ForWriting属性。代码如下：
var fso, f1, ts;
var ForWriting = 2;
fso = new ActiveXObject("ScriptingFileSystemObject");
fsoCreateTextFile ("c:\test1txt");
f1 = fsoGetFile("c:\test1txt");
ts = f1OpenAsTextStream(ForWriting, true);
（二）添加数据到文件
当文件被创建后，一般要按照“打开文件－>填写数据－>关闭文件”的步骤实现添加数据到文件的目的。
打开文件可使用FileSystemObject对象的OpenTextFile方法，或者使用File对象的OpenAsTextStream方法。
填写数据要使用到TextStream对象的Write、WriteLine或者WriteBlankLines方法。在同是实现写入数据的功能下，这3者的区别在于：Write方法不在写入数据末尾添加新换行符，WriteLine方法要在最后添加一个新换行符，而WriteBlankLines则增加一个或者多个空行。
关闭文件可使用TextStream对象的Close方法。
（三）创建文件及添加数据例程
下面的代码将创建文件、添加数据、关闭文件几个步骤结合起来进行应用：
var fso, tf;
fso = new ActiveXObject("ScriptingFileSystemObject");
// 创建新文件
tf = fsoCreateTextFile("c:\testfiletxt", true);
// 填写数据，并增加换行符
tfWriteLine("Testing 1, 2, 3") ;
// 增加3个空行
tfWriteBlankLines(3) ;
// 填写一行，不带换行符
tfWrite ("This is a test");
// 关闭文件
tfClose();
（四）读取文件内容
从文本文件中读取数据要使用TextStream对象的Read、ReadLine或ReadAll 方法。Read方法用于读取文件中指定数量的字符； ReadLine方法读取一整行，但不包括换行符；ReadAll方法则读取文本文件的整个内容。读取的内容存放于字符串变量中，用于显示、分析。
以上就是关于原生js获取文件全部的内容，包括:原生js获取文件、如何利用Js获取当前地址的文件名并做相应 *** 作啊、js如何读取文件夹文件等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）