javascript 学习笔记 -- js获取本地文件信息

JavaScript是跑在浏览器中,所以对于JavaScript读取本地文件不想c++ 和 java那样easy。网上有很多关于读取本地文件的方法,许多是用ActiveXObject控件。ActiveXObject是微软特有的,只能在IE内核的浏览器中运行,所以也不是一个好方法。

这里,介绍一种用Xml读取本地文件的方法。

第一步:

Ngnix 服务器配置

下载ngnix(http://nginx.org/en/download.html), 解压缩之后,打开nginx\conf\nginx.conf文件。配置root目录为你的HTML脚本目录。我的目录是F:\webgl

启动ngnix,(直接ngnix / ngnix –s reload)

 1         listen       80;
 2         server_name  localhost;
 3
 4         #charset koi8-r;
 5
 6         #access_log  logs/host.access.log  main;
 7
 8         location / {
 9             root   F:\webgl;
10             index  index.html index.htm;
11         }

第二步:

HTML代码

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6 </head>
 7 <body>
 8
 9 <script !src="">
10
11     function loadDoc() {
12         var xhttp = new XMLHttpRequest();
13         xhttp.onreadystatechange = function() {
14             if (xhttp.readyState == 4 && xhttp.status == 200) {
15                 for (var x in xhttp.responseText) {
16                     console.log(xhttp.responseText[x]);
17                 }
18             }
19         };
20         xhttp.open("GET", "ajax_info.txt", true);
21         xhttp.send();
22     }
23
24     loadDoc();
25
26 </script>
27
28 </body>
29 </html>

运行结果:

文本内容

chorme浏览器运行结果

时间: 2024-10-08 19:01:02

javascript 学习笔记 -- js获取本地文件信息的相关文章

JavaScript学习笔记——js变量的布尔值

typeof(1): numbertypeof(NaN): numbertypeof(Number.MIN_VALUE): numbertypeof(Infinity): numbertypeof("123"): stringtypeof(true): booleantypeof(window): objecttypeof(Array()): objecttypeof(function(){}): functiontypeof(document): objecttypeof(null)

JavaScript进阶 九 JS实现本地文件上传至阿里云服务器

JS实现本地文件上传至阿里云服务器 前言 在前面的博客< JavaScript进阶(八)JS实现图片预览并导入服务器功能>(点击查看详情)中,实现了JS将本地图片文件预览并上传至阿里云服务器的操作.这次需要实现将本地打包好的文件上传至阿里云服务器.使用前面的图片文件上传方法无法完成此操作.操作界面如下: 思路 本地与服务端传输文件的格式应该是熟悉的Base64格式.首先需要将本地文件转换为Base64格式,传输至服务端后,在服务端再将Base64格式的文件转换为原始文件. 源码解析 控制器 /

前端用js获取本地文件的内容

这里要写成input的形式 调用upload函数 传递的参数就表示所选的文件<input type="file" onchange="upload(this)" /> //前端读取本地文件的内容 下面代码中的this.result即为获取到的内容 function upload(input) { //支持chrome IE10 if (window.FileReader) { var file = input.files[0]; filename = f

JAVAscript学习笔记 js句柄监听事件 第四节 (原创) 参考js使用表

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>句柄添加监听事件</title> <script type="text/javascript" src="tzy.js"></script> </head> <body>

JS获取本地文件并且解析文件内容(XML,TXT)

$(function(){ $("body").on("change", "#file", function (event) { uploadfile(this,event); }) function uploadfile(){ var files = event.target.files, file; if (files && files.length > 0) { // 获取目前上传的文件 file = files[0]

IOS学习笔记之获取Plist文件读取数据

@property(nonatomic,strong) NSArray *pic; //创建数组属性 @property(nonatomic,assign) int index; //创建索引属性 @property (strong, nonatomic) IBOutlet UIImageView *imageIcon; //列表上的UIImageView - (void)viewDidLoad {    [super viewDidLoad];    //首次加载时调用数据方法,让index显

JAVAscript学习笔记 js异常 第二节 (原创) 参考js使用表

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>异常处理</title> <script> function demo() { try { alert(str);//str为空 }catch(err){ alert(err); } } demo(); function demo1(){ var

JAVAscript学习笔记 js事件 第一节 (原创) 参考js使用表

<!DOCTYPE html> <html lang="en" onUnload="ud()"> <head> <meta charset="UTF-8"> <title>Title</title> <script> function demo() { alert("hello"); } function onOver(ooj) { ooj.i

JAVAscript学习笔记 js条件语句 第三节 (原创) 参考js使用表 (2017-09-14 15:55)

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>语句</title> <script> var i = 9;//修改i值 if (i > 10) { document.write("我大于10"+"</br>"); } else if