问题域:
javascript 如何操作本地文件(创建,更新);
解析:
javascript对服务器端的文件操作只要传输数据就可以了,具体的文件创建,删除,更新操作交给服务端的java代码就可以了。
但是对本地的文件操作就有点麻烦了,因为javascript为了安全不许直接对本地文件进行写的操作。但是可以读取。
方案:采用 ActiveXObject来读取xml文件
var xmlDoc;
function loadXML() {
// code for IE
if (window.ActiveXObject) {
xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.async=false;
xmlDoc.load("c:\\myjstest.xml");
getmessage();
}
// code for Mozilla, Firefox, Opera, etc.
else if (document.implementation
&&document.implementation.createDocument){
xmlDoc=document.implementation
.createDocument("","",null);
xmlDoc.load("c:\\myjstest.xml");
xmlDoc.onload=getmessage;
} else {
alert('Your browser cannot handle this script');
}
}
function getmessage() {
document.getElementById("to").innerHTML = xmlDoc.getElementsByTagName("to")[0].childNodes[0].nodeValue;
document.getElementById("from").innerHTML = xmlDoc.getElementsByTagName("from")[0].childNodes[0].nodeValue;
document.getElementById("message").innerHTML= xmlDoc.getElementsByTagName("body")[0].childNodes[0].nodeValue;
}
注意:读取可以兼容其他主流浏览器
方案二:FileSystemObject对象有读写
var fso = new ActiveXObject("Scripting.FileSystemObject");
var f1 = fso.CreateTextFile("c:\\myjstest.xml", true);//"true"
f1.WriteLine("<?xml version=\"1.0\" encoding=\"UTF-8\"?> ");
f1.WriteLine("<root>");
f1.WriteLine("<to>huguoqing</to>");
f1.WriteLine("<from>126</from>");
f1.WriteLine("<body>Hello word!</body>");
f1.WriteLine("</root>");
f1.WriteBlankLines(2);//写入两个空行
f1.Close();
var ForReading = 1; //读的标志位1
var fsource = fso.OpenTextFile("c:\\myjstest.xml", ForReading);
fcontent = fsource.ReadLine();
alert("File contents ="+fcontent);
ts.Close();
注意:如果是IE浏览器会有安全提示的对话框弹出询问。执行操作。
如果是其他浏览器则提示报错,代码不执行。
参考资料:
一、功能实现核心:FileSystemObject 对象
其实,要在Javascript中实现文件操作功能,主要就是依靠FileSystemobject对象。在详细介绍FileSystemobject对象的各个属性和方法的使用细节前,先来看看这个对象包括哪些相关对象和集合:
二、FileSystemObject编程三部曲
使用FileSystemObject 对象进行编程很简单,一般要经过如下的步骤: 创建FileSystemObject对象、应用相关方法、访问对象相关属性 。
(一)创建FileSystemObject对象
创建FileSystemObject对象的代码只要1行:
var fso = new ActiveXObject("Scripting.FileSystemObject");
上述代码执行后,fso就成为一个FileSystemObject对象实例。
(二)应用相关方法
创建对象实例后,就可以使用对象的相关方法了。比如,使用CreateTextFile方法创建一个文本文件:
var fso = new ActiveXObject("Scripting.FileSystemObject");
var f1 = fso.createtextfile("c:\myjstest.txt",true");
(三)访问对象相关属性
要访问对象的相关属性,首先要建立指向对象的句柄,这就要通过get系列方法实现:GetDrive负责获取驱动器信息,GetFolder负责获取文件
夹信息,GetFile负责获取文件信息。比如,指向下面的代码后,f1就成为指向文件c: est.txt的句柄:
var fso = new ActiveXObject("Scripting.FileSystemObject");
var f1 = fso.GetFile("c:\myjstest.txt");
然后,使用f1访问对象的相关属性。比如:
var fso = new ActiveXObject("Scripting.FileSystemObject");
var f1 = fso.GetFile("c:\myjstest.txt");
alert("File last modified: " + f1.DateLastModified);
执行上面最后一句后,将显示c:myjstest.txt的最后修改日期属性值。
但有一点请注意:对于使用create方法建立的对象,就不必再使用get方法获取对象句柄了,这时直接使用create方法建立的句柄名称就可以:
var fso = new ActiveXObject("Scripting.FileSystemObject");
var f1 = fso.createtextfile("c:\myjstest.txt",true");
alert("File last modified: " + f1.DateLastModified);
三、操作驱动器(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("Scripting.FileSystemObject");
drv = fso.GetDrive(fso.GetDriveName("c:\"));
s += "Drive C:" + " - ";
s += drv.VolumeName + " ";
s += "Total Space: " + drv.TotalSize / 1024;
s += " Kb" + " ";
s += "Free Space: " + drv.FreeSpace / 1024;
s += " Kb" + " ";
alert(s);
执行后出现下面的信息框:
四、操作文件夹(Folders)
涉及到文件夹的操作包括创建、移动、删除以及获取相关属性。
(一) Folder对象的相关属性和方法列表
(二)Folder对象操作例程
下面的例程将练习获取父文件夹名称、创建文件夹、删除文件夹、判断是否为根目录等操作:
var fso, fldr, s = "";
// 创建FileSystemObject对象实例
fso = new ActiveXObject("Scripting.FileSystemObject");
// 获取Drive 对象
fldr = fso.GetFolder("c:\");
// 显示父目录名称
alert("Parent folder name is: " + fldr + " ");
// 显示所在drive名称
alert("Contained on drive " + fldr.Drive + " ");
// 判断是否为根目录
if (fldr.IsRootFolder)
alert("This is the root folder.");
else
alert("This folder isn't a root folder.");
alert(" ");
// 创建新文件夹
fso.CreateFolder ("C:\Bogus");
alert("Created folder C:\Bogus" + " ");
// 显示文件夹基础名称,不包含路径名
alert("Basename = " + fso.GetBaseName("c:\bogus") + " ");
// 删除创建的文件夹
fso.DeleteFolder ("C:\Bogus");
alert("Deleted folder C:\Bogus" + " ");
五、操作文件(Files)
对文件进行的操作要比以上介绍的驱动器(Drive)和文件夹(Folder)操作复杂些,基本上分为以下两个类别:对文件的创建、拷贝、移动、删除操作和对文件内容的创建、添加、删除和读取操作。下面分别详细介绍。
(一)创建文件
一共有3种方法可用于创建一个空文本文件,这种文件有时候也叫做文本流(text stream)。
第一种是使用CreateTextFile方法。代码如下:
var fso, f1;
fso = new ActiveXObject("Scripting.FileSystemObject");
f1 = fso.CreateTextFile("c:\testfile.txt", true);
第二种是使用OpenTextFile方法,并添加上ForWriting属性,ForWriting的值为2。代码如下:
var fso, ts;
var ForWriting= 2;
fso = new ActiveXObject("Scripting.FileSystemObject");
ts = fso.OpenTextFile("c:\test.txt", ForWriting, true);
第三种是使用OpenAsTextStream方法,同样要设置好ForWriting属性。代码如下:
var fso, f1, ts;
var ForWriting = 2;
fso = new ActiveXObject("Scripting.FileSystemObject");
fso.CreateTextFile ("c:\test1.txt");
f1 = fso.GetFile("c:\test1.txt");
ts = f1.OpenAsTextStream(ForWriting, true);
(二)添加数据到文件
当文件被创建后,一般要按照“打开文件->填写数据->关闭文件”的步骤实现添加数据到文件的目的。
打开文件可使用FileSystemObject对象的OpenTextFile方法,或者使用File对象的OpenAsTextStream方法。
填写数据要使用到TextStream对象的Write、WriteLine或者WriteBlankLines方法。在同是实现写入数据的功能下,这3
者的区别在于:Write方法不在写入数据末尾添加新换行符,WriteLine方法要在最后添加一个新换行符,而WriteBlankLines则增加
一个或者多个空行。
关闭文件可使用TextStream对象的Close方法。
(三)创建文件及添加数据例程
下面的代码将创建文件、添加数据、关闭文件几个步骤结合起来进行应用:
var fso, tf;
fso = new ActiveXObject("Scripting.FileSystemObject");
// 创建新文件
tf = fso.CreateTextFile("c:\testfile.txt", true);
// 填写数据,并增加换行符
tf.WriteLine("Testing 1, 2, 3.") ;
// 增加3个空行
tf.WriteBlankLines(3) ;
// 填写一行,不带换行符
tf.Write ("This is a test.");
// 关闭文件
tf.Close();
(四)读取文件内容
从文本文件中读取数据要使用TextStream对象的Read、ReadLine或ReadAll
方法。Read方法用于读取文件中指定数量的字符;ReadLine方法读取一整行,但不包括换行符;ReadAll方法则读取文本文件的整个内容。读取
的内容存放于字符串变量中,用于显示、分析。在使用Read或ReadLine方法读取文件内容时,如果要跳过一些部分,就要用到Skip或
SkipLine方法。
下面的代码演示打开文件、填写数据,然后读取数据:
var fso, f1, ts, s;
var ForReading = 1;
fso = new ActiveXObject("Scripting.FileSystemObject");
// 创建文件
f1 = fso.CreateTextFile("c:\testfile.txt", true);
// 填写一行数据
f1.WriteLine("Hello World");
f1.WriteBlankLines(1);
// 关闭文件
f1.Close();
// 打开文件
ts = fso.OpenTextFile("c:\testfile.txt", ForReading);
// 读取文件一行内容到字符串
s = ts.ReadLine();
// 显示字符串信息
alert("File contents = '" + s + "'");
// 关闭文件
ts.Close();
(五)移动、拷贝和删除文件
对于以上三种文件操作,Javascript各有两种对应的方法:File.Move 或
FileSystemObject.MoveFile用于移动文件;File.Copy 或
FileSystemObject.CopyFile用于拷贝文件;File.Delete 或
FileSystemObject.DeleteFile用于删除文件。
下面的代码演示在驱动器C的根目录下创建一个文本文件,填写一些内容,然后将文件移动到 mp目录下,再在目录 emp下面建立一个文件拷贝,最后删除这两个目录的文件:
var fso, f1, f2, s;
fso = new ActiveXObject("Scripting.FileSystemObject");
f1 = fso.CreateTextFile("c:\testfile.txt", true);
// 写一行
f1.Write("This is a test.");
// 关闭文件
f1.Close();
// 获取C:根目录下的文件句柄
f2 = fso.GetFile("c:\testfile.txt");
// 移动文件到 mp目录下
f2.Move ("c:\tmp\testfile.txt");
// 拷贝文件到 emp目录下
f2.Copy ("c:\temp\testfile.txt");
// 获取文件句柄
f2 = fso.GetFile("c:\tmp\testfile.txt");
f3 = fso.GetFile("c:\temp\testfile.txt");
// 删除文件
f2.Delete();
f3.Delete();
六、结 语
通过以上对FileSystemObject的各种对象、属性和方法的介绍和示例,相信你已经对如何使用JavaScript语言在页面中操作驱动器、文
件和文件夹有了清晰的认识。但是上述提及的例程都非常简单,要全面、灵活地掌握JavaScript文件操作技术,还需要大量的实践练习。而且还有一点提
醒大家,由于涉及到在浏览器中进行文件读写这样的高级操作,对于默认的浏览器安全级别而言,在代码运行前都会有一个信息提示,这点请在实际环境中提示访问
者注意。
Top
<script language="JavaScript">
<!--
function ReadTxt(file,oTxt){
var path=file.value
var fso = new ActiveXObject("Scripting.FileSystemObject");
var f = fso.OpenTextFile(path, 1);
oTxt.value=f.ReadAll();
}
//-->
</script>
<form>
<input type="file" name="file1"><input type=button onclick="ReadTxt(file1,txt)" value="Read">
<textarea name="txt"></textarea>
</form>
分享到:
相关推荐
FileReader是JavaScript操作本地文件的核心工具,它提供了异步读取文件的方法。主要有以下方法: - `readAsText(file, encoding)`: 将文件内容读取为文本,可以指定编码。 - `readAsDataURL(file)`: 读取文件为...
JavaScript操作本地文件的能力是Web开发中的一个重要进展,特别是在现代浏览器如Chrome、IE和Firefox中,JavaScript引擎的性能提升使得更多的复杂任务得以实现。W3C正在考虑的一个草案就是JavaScript直接操作本地...
在探讨“JavaScript读取本地文件”的主题时,我们主要聚焦于如何利用JavaScript在浏览器环境中读取用户计算机上的本地文件。这种功能在很多场景下都极为有用,比如在上传文件前预览其内容、数据导入导出操作等。下面...
那就请跟我来,本文将详细描述如何使用Javascript语言进行文件操作。 一、功能实现核心:FileSystemObject 对象 其实,要在Javascript中实现文件操作功能,主要就是依靠FileSystemobject对象。在详细介绍...
由于 JavaScript 基于安全考虑,不允许直接操作本地文件,因此需要使用插件或其他方式来实现文件保存。基于 FileSaver.js 插件实现保存文件到本地的方法是目前最流行和最可靠的方法之一。 FileSaver.js 插件是一个...
虽然JavaScript在客户端直接读写本地文件受到限制,但通过File API、Blob、ArrayBuffer、FileSystem API、Web Workers等技术,开发者仍然能够有效地处理和操作本地文件。在服务器端,Node.js提供了一整套强大的工具...
在JavaScript中实现一个本地文件选择器功能,是前端开发中常见的需求,这通常涉及到HTML5的File API。这个功能允许用户从他们...理解并掌握这些API,就能灵活地处理用户选择的本地文件,无论是预览、上传还是其他操作。
1. **权限问题**:在 Web 浏览器环境中,由于安全限制,直接使用 JavaScript 操作本地文件通常是不允许的。上述代码只能在支持 ActiveX 的环境中运行,例如 IE 浏览器。 2. **跨浏览器兼容性**:现代浏览器不支持 ...
但是JavaScript不仅仅局限于网页上的交互,它还可以执行文件保存操作,即将数据保存到用户的本地计算机上。本文将介绍如何使用JavaScript保存文本文件到本地的两种方法,并将分别解释每种方法的工作原理及其应用场景...
JavaScript,作为一种广泛应用于Web开发的脚本语言,其在处理本地文件方面的能力是有限的,因为出于安全原因,浏览器对JavaScript直接操作本地文件有严格的限制。然而,通过一些技术手段,我们可以实现用户交互式的...
JavaScript文件操作是一个重要的编程主题,尤其对于Web开发者来说,它允许在浏览器环境中处理本地文件,实现数据的存储和读取。以下是对这个主题的详细解释: 1. **File API**: JavaScript中的File API是HTML5引入...
- **JavaScript限制**: 由于同源策略(Same-origin policy)的存在,JavaScript无法直接访问或控制不同源上的资源,这包括本地文件系统。 - **ActiveX控件**: 在Internet Explorer浏览器中,可以通过ActiveX控件绕过...
标题中提到的是JavaScript实现将文件保存到本地的方法汇总,具体的知识点涵盖了以下三个方面: 1. 使用JavaScript保存文件到本地的基本方法和原理。在Web开发中,通常我们没有直接的方法去保存文件到用户的设备上,...
在探讨JavaScript文件操作时,我们聚焦于一种特定的环境——即支持ActiveX对象的Internet Explorer浏览器,因为JavaScript原生并不具备直接读写本地文件系统的权限,这是出于安全考虑。然而,在IE中,通过使用`...
JavaScript 文件操作主要依赖于 `FileSystemObject` 对象,这是一个ActiveX对象,主要用于在Windows环境中进行文件和文件夹的管理。以下是对标题和描述中涉及的知识点的详细解释: 1. **FileSystemObject对象**: ...
`FileSystemObject`是JavaScript中用于操作本地文件系统的一个对象,它提供了丰富的API来处理文件和文件夹。这个对象属于ActiveX对象,因此只能在支持ActiveX的环境中使用,如Internet Explorer浏览器。 #### 三、`...
但在某些特定环境下(如本地应用或者特定的脚本环境),JavaScript可以通过特定的对象来实现对本地文件的操作。例如,在ActiveX控件的支持下,可以利用`Scripting.FileSystemObject`对象来进行文件的读写操作。 ###...
描述中的“用js打开本地的QQ文件,报错先把网站加入信任站点才能创建对象调用”揭示了一个关键问题:在IE中,尝试通过JavaScript直接操作本地文件通常会遇到安全警告,除非用户已将网站添加到其信任站点列表中。...
JavaScript对文件管理主要涉及到Web应用程序中的前端文件操作,这在现代网页应用中变得越来越重要,因为用户经常需要在不离开浏览器的情况下上传、下载或者处理本地文件。JavaScript通过一系列API,如File API、...
人机交互方式实现,WEB操作本地文件; h5文件操作API,FileReader()方式实现,传入该方法的参数为FileList()对象获取到的值; 【 var selectedFile = document.getElementById("upload").files[0]; ………………...