这里要写成input的形式 调用upload函数  传递的参数就表示所选的文件
<input type="file" onchange="upload(this)" />
//前端读取本地文件的内容   下面代码中的this.result即为获取到的内容
function upload(input) { //支持chrome IE10
if (window.FileReader) {
var file = input.files[0];
filename = file.name.split(".")[0];
var reader = new FileReader();
reader.onload = function() {
console.log(this.result)
alert(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);
alert(xmlDoc.xml);
}
//支持FF
else if (document.implementation && document.implementation.createDocument) {
var xmlDoc;
xmlDoc = document.implementation.createDocument("", "", null);
xmlDoc.async = false;
xmlDoc.load(input.value);
alert(xmlDoc.xml);
} else {
alert('error');
}
}

前端用js获取本地文件的内容的更多相关文章

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

    JavaScript是跑在浏览器中,所以对于JavaScript读取本地文件不想c++ 和 java那样easy.网上有很多关于读取本地文件的方法,许多是用ActiveXObject控件.Active ...

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

    $(function(){ $("body").on("change", "#file", function (event) { uploa ...

  3. 手工创建tomcat应用,以及实现js读取本地文件内容

    手工创建tomcat应用: 1.在webapps下面新建应用目录文件夹 2.在文件夹下创建或是从其他应用中复制:META-INF,WEB-INF这两个文件夹, 其中META-INF清空里面,WEB-I ...

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

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

  5. js/jquery 获取本地文件的文件路劲 获取input框中type=‘file’ 中的文件路径(转载)

     原文:http://blog.csdn.net/niyingxunzong/article/details/16989947 js/jquery 获取本地文件的文件路劲 获取input框中type= ...

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

    JS实现本地文件上传至阿里云服务器 前言 在前面的博客< JavaScript进阶(八)JS实现图片预览并导入服务器功能>(点击查看详情)中,实现了JS将本地图片文件预览并上传至阿里云服务 ...

  7. 【基础篇】js对本地文件增删改查--增

    前置条件: 1. 本地有安装node,点击传送门 项目目录: 1. msg.json内容 { "data": [ { "id": 1, "name&q ...

  8. FileReader对象异步获取外部文件的内容

    1.在网页表单中,定义input的type为file,就可以打开存储在计算机上的文件. <!DOCTYPE html> <head> <meta charset=&quo ...

  9. 为什么不能用 JS 获取剪贴板上的内容?

    为什么不能用 JS 获取剪贴板上的内容? 为什么不能用 JS 获取剪贴板上的内容? 发一串口令给朋友朋友复制这串口令,然后访问你的网站你在网站上用 JS 读取朋友剪贴板上的口令根据不同的口令,显示不同 ...

随机推荐

  1. js面向对象的笼统介绍

    **js进阶大纲**简单的表面组成:**对象的属性分两类,一类是数据属性,一类是访问器属性**1,数据属性用来保存数据.2,访问器属性不用来保存数据,而是定义了get,set两个函数,读取属性时,自动 ...

  2. Pandas | 25 文件读写

    Pandas I/O API是一套像pd.read_csv()一样返回Pandas对象的顶级读取器函数. 读取文本文件(或平面文件)的两个主要功能是read_csv()和read_table().它们 ...

  3. Quay: Introducing an Application Registry for Kubernetes

    转自: https://coreos.com/blog/quay-application-registry-for-kubernetes.html When we started Quay, we w ...

  4. C语言博客作业2019-04--数组

    0.展示PTA总分(0----2) 展示3张关于"数组题目集"分数截图. 1.本章学习总结(2分) 1.1 学习内容总结 整理数组这章学习主要知识点,必须包含内容有: 数组中如何查 ...

  5. Maven 基本概念——根目录、项目创建、坐标

     1. MavenProjectRoot(项目根目录)   |----src   |     |----main   |     |         |----java ——存放项目的.java文件  ...

  6. java基础 类 & 继承

    类 在Java中,类文件是以.java为后缀的代码文件,在每个类文件中可以有多个类,但是最多只允许出现一个public类,当有public类的时候,类文件的名称必须和public类的名称相同,若不存在 ...

  7. libevent笔记2:Hello_World

    本篇通过libevent提供的Hello_World demo简单介绍基于libevent的TCP服务器的实现 listener listener是libevent提供的一种监听本地端口的数据结构,在 ...

  8. pip: failed to create process.解决方法

    昨天在使用pip过程,pip提示:failed to create process. 解决方法:python -m pip install xxx 就可以了 如以matplotlib为例即:pytho ...

  9. IBM X3650 m4 面板指示灯

  10. TaskTimer

    什么是调度 任务:就是事情 调度:在不同的时间点或者在指定的时间点或者间隔多长时间去运行这个任务.就是生活中的闹钟 相关的类Timer 类:位于 java.util 包中 案例 实现时间的动态刷新 任 ...