最近需要在客户端操作文件,看到网上有 FileReader 对象,链接:https://developer.mozilla.org/zh-CN/docs/Web/API/FileReader
还是直接上代码吧,大家自己看:
 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
function upload(input) {
//支持chrome IE10
if (window.FileReader) {
var file = input.files[];
filename = file.name.split(".")[];
var reader = new FileReader();
reader.onload = function() {
console.log(this.result);
}
reader.readAsText(file);
}
//支持IE 7 8 9 10
else if (typeof window.ActiveXObject != 'undefined'){
var xmlDoc;
xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.async = false;
xmlDoc.load(input.value);
console.log(xmlDoc.xml);
}
//支持FF
else if (document.implementation && document.implementation.createDocument) {
var xmlDoc;
xmlDoc = document.implementation.createDocument("", "", null);
xmlDoc.async = false;
xmlDoc.load(input.value);
console.log(xmlDoc.xml);
} else {
alert('error');
}
}
</script>
</head>
<body>
<input type="file" onchange="upload(this)" />
</body>
</html>

不仅可以读取文本文件,还可以读取JS文件,CSS,HTML等纯文本格式,下面是运行效果(读取了oracle的tnsnames.ora文件)

出处:https://www.cnblogs.com/yaotome/p/9002172.html

使用JS的 FileReader 读取本地文本文件(可兼容各种浏览器)的更多相关文章

  1. 使用JS读取本地文本文件(兼容各种浏览器)

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. FileReader读取本地文件

    FileReader是一种异步读取文件机制,结合input:file可以很方便的读取本地文件. 一.input:type[file] file类型的input会渲染为一个按钮和一段文字.点击按钮可打开 ...

  3. 【转】js实现复制到剪贴板功能,兼容所有浏览器

    两天前听了一个H5的分享,会议上有一句话,非常有感触:不是你不能,而是你对自己的要求太低.很简单的一句话,相信很多事情不是大家做不到,真的是对自己的要求太低,如果对自己要求多一点,那么你取得的进步可能 ...

  4. 【原】js实现复制到剪贴板功能,兼容所有浏览器

    两天前听了一个H5的分享,会议上有一句话,非常有感触:不是你不能,而是你对自己的要求太低.很简单的一句话,相信很多事情不是大家做不到,真的是对自己的要求太低,如果对自己要求多一点,那么你取得的进步可能 ...

  5. 黄聪:JS实现复制到剪贴板功能,兼容所有浏览器(转)

    两天前听了一个H5的分享,会议上有一句话,非常有感触:不是你不能,而是你对自己的要求太低.很简单的一句话,相信很多事情不是大家做不到,真的是对自己的要求太低,如果对自己要求多一点,那么你取得的进步可能 ...

  6. js实现多物体运动框架并兼容各浏览器

    首先,我们须要知道在js中获取对象的宽度如offsetWidth等.可能会存在一些小小的bug.原因之中的一个在于offsetWidth只不过获取盒子模型中内容的部分宽度.并不包括内边距,边框和外边距 ...

  7. js实现复制到剪贴板功能,兼容所有浏览器

    http://www.cnblogs.com/PeunZhang/p/3324727.html https://github.com/zeroclipboard/ZeroClipboard 复制链接到 ...

  8. js鼠标滑轮滚动事件绑定(兼容主流浏览器)

    /** Event handler for mouse wheel event. *鼠标滚动事件 */ var wheel = function(event) { var delta = 0; if ...

  9. 前台JS(type=‘file’)读取本地文件的内容,兼容各种浏览器

    [自己测了下,能兼容各种浏览器,但是读取中文会出现乱码.自己的解决方法是用notepad++把txt文件编码改为utf-8(应该是和浏览器编码保持一致吧?..)] 原文  http://blog.cs ...

随机推荐

  1. HashMap源码1

    jdk1.8之前是数组+链表的形式,后面会介绍jdk1.8对hashMap的改动:数组+链表+红黑树 transient是Java语言的关键字,用来表示一个域不是该对象串行化的一部分. 当一个对象被串 ...

  2. select列表遍历和触发事件

    1.以下两种都是jquery获取select列表被选中的value.var strText=$("#select_id").find("option:selected&q ...

  3. Flink 源码解析 —— 项目结构一览

    Flink 源码项目结构一览 https://t.zsxq.com/MNfAYne 博客 1.Flink 从0到1学习 -- Apache Flink 介绍 2.Flink 从0到1学习 -- Mac ...

  4. Python将背景图片的颜色去掉

    一.问题  在使用图片的时候有时候我们希望把背景变成透明的,这样就只关注于图片本身.比如在连连看中就只有图片,而没有背景,其实我个人感觉有背景好看一点. 二.解决  我们需要使用RGBA(Red,Gr ...

  5. excel查找定位操作(for lutai)

    产成品出库的单价要根据订单号和存货编码引用产成品入库的单价 方法一:使用Index 和Match =INDEX(产成品入库!I2:P13    ,IF( ) ,7) 方法二:使用vlookup ,首先 ...

  6. golang 学习笔记 使用cmd

    package main import ( "bytes" "fmt" "os/exec" ) func main() { cmd0 := ...

  7. 在 Docker 中运行 SpringBoot 应用

    创建 SpringBoot 项目 用 Idea 创建一个 SpringBoot 项目,编写一个接口: package cloud.dockerdemo import org.springframewo ...

  8. C#写入Excel文件方式

    由于在工作中经常要把数据库的统计数据导入Excel文件,进行IO磁盘操作,所以在这里记录下. 首先创建默认文件夹,并返回文件夹路径. private static string CPath(strin ...

  9. 文件的读取(txt文件)

    一.将读取文件夹内容,变为字典保存,代码如下: def read_class_names(class_file_name): '''loads class name from a file''' na ...

  10. Java自学-接口与继承 多态

    Java的多态 操作符的多态 +可以作为算数运算,也可以作为字符串连接 类的多态 父类引用指向子类对象 示例 1 : 操作符的多态 同一个操作符在不同情境下,具备不同的作用 如果+号两侧都是整型,那么 ...