之前我们都把数据 放在了 localStorage 里,但扩展一旦卸载,数据就会被清空,

在Console里备份,一次只能输出一条,小白操作起来很不方便,所以能不能 导入,导出文件来进行备份还原呢?

这里的用到FileReader 这个类,还有一个FileSaver.js ,开源的网上能下载到

导入导出 核心代码如下

 <!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<input type="file" id="input">导入配置文件 </br>
<textarea id="inputdata" placeholder="显示导入数据"></textarea></br>
<input type="button" id="output" value="导出"/>
</body>
<script src="FileSaver.min.js"></script>
<script type="text/javascript">
// 导入
document.getElementById("input").addEventListener("change", function(e){
var file=e.target.files[0];
var reader = new FileReader();
reader.onload = function(e){
document.getElementById("inputdata").value =e.target.result;
};
reader.readAsText(file);
});
//导出
document.getElementById("output").onclick = function(){
var content ="我是要保存的字符串";
var blob = new Blob([content], {type: "text/plain;charset=utf-8"});
saveAs(blob, "save.txt");
};
</script>
</html>

遍历 localStorage

for (var i = 0; i < localStorage.length; i++) {

console.log( localStorage.key(i) + ":" + localStorage.getItem(localStorage.key(i)));

}

注意那个那个localStorage.key(i) 是圆括号,不是方括号[i]

遍历之后 组成字符串,导出成备份文件,然后导入就写入 localStorage相应位置,这样就方便多了。

开启 扩展 “选项”模式,

"options_page": "options.html",

options ,popup ,可以在其页面内调用 background 的方法,如

var bg = chrome.extension.getBackgroundPage();

var msg = bg.msg;           //获取变量

bg.func(); //调用方法

然后把上面 说的功能 加到扩展里去。。用户就有更多的修改空间了

斗鱼扩展--localStorage备份与导出(九)的更多相关文章

  1. mongodb 备份 还原 导出 导入

    张映 发表于 2013-12-03 分类目录: nosql 标签:mongodb, 备份, 导入, 导出, 还原 mongodb数据备份和还原主要分为二种,一种是针对于库的mongodump和mong ...

  2. CSDN博客文章的备份及导出电子书CHM

    需要用到的工具集合下载:http://download.csdn.net/source/2881423 在CSDN.百度等写博客文章的应该很多,很多时候担心服务器有一天突然挂了,或者担心自己的号被封了 ...

  3. mongodb 数据库操作--备份 还原 导出 导入(转)

    mongodb 数据库操作--备份 还原 导出 导入   -------------------MongoDB数据导入与导出------------------- 1.导出工具:mongoexport ...

  4. 斗鱼扩展初识Chrome扩展(一)

    看斗鱼有些时间了,也写了不少辅助的js,但是昨天不小心把硬盘分区表搞没了,自己写了好久的代码不见了,DiskGenius 也没恢复成功,所以要重写一次,大家要引以为鉴,常备份代码,github是个不错 ...

  5. mongodb数据库备份导入导出数据

    备份数据: mongodump -h 192.168.2.20 -u game -p 12345678 -d dbname -o /data/test/ --excludeCollection=use ...

  6. mongodb 数据库操作--备份 还原 导出 导入

    mongodb数据备份和还原主要分为二种,一种是针对于库的mongodump和mongorestore,一种是针对库中表的mongoexport和mongoimport 一,mongodump备份数据 ...

  7. mongodb数据库操作--备份 还原 导出 导入

    首先数据库备份: mongodump -h IP --port 端口 -u 用户名 -p 密码 -d 数据库 -o 文件存在路径  mongodump -h 127.0.0.1 -u admin -p ...

  8. 推荐一款自己的软件作品[豆约翰博客备份专家],新浪博客,QQ空间,CSDN,cnblogs博客备份,导出CHM,PDF(转载)

    推荐一款自己的软件作品[豆约翰博客备份专 豆约翰博客备份专家是完全免费,功能强大的博客备份工具,博客电子书(PDF,CHM和TXT)生成工具,博文离线浏览工具,软件界面美观大方,支持多个主流博客网站( ...

  9. mongodb远程数据库的连接以及备份导入导出数据

    环境win10; 运行cmd cd到目录mongodb的bin目录: 连接远程mongodb: 连接命令:mongo -u username -p pwd host:post/database(数据库 ...

随机推荐

  1. 利用PIL实现图片的切割

    功能描述: 切图前是一张图,切图后就是九张图!!! 展示: 实现流程图: 代码实现 # -*- coding: utf-8 -*- ''' 将一张图片填充为正方形后切为9张图 ''' from PIL ...

  2. Spring core注解

    1.@Autowired Autowired是用在JavaBean中的注解,通过byType形式,用来给指定的字段或方法注入所需的外部资源 Autowired注解来指定自动装配,可以修饰setter方 ...

  3. HDU - 1754 I Hate It (线段树单点修改,求区间最大值)

    很多学校流行一种比较的习惯.老师们很喜欢询问,从某某到某某当中,分数最高的是多少. 这让很多学生很反感. 不管你喜不喜欢,现在需要你做的是,就是按照老师的要求,写一个程序,模拟老师的询问.当然,老师有 ...

  4. EOS 修改文件名称与文件夹名称

    最近有一个需求,需要修改EOS名称,将所有文件里面的EOS改为UOS,文件夹名称也需要修改,然后重新构建项目,于是写了一个小程序进行修改.如果有相同项目类似的修改,可以在下面这个程序稍做修改就可以了. ...

  5. 关于如何使用代码触发 UIButton的Unwind Segue

    当我们在一个控制视图上,在UITextField输入文字信息之后,希望可以使用键盘的Done触发一个 Done的UIButton,但是刚开始我直接在 -(BOOL)textFieldShouldRet ...

  6. python 矩阵(mat)操作

    1.矩阵的创建 由一维或二维数据创建矩阵 a1=array([1,2,3]); a1=mat(a1); data1=mat(zeros((3,3))); #创建一个3*3的零矩阵,矩阵这里zeros函 ...

  7. [USACO09FEB]改造路Revamping Trails 分层最短路 Dijkstra BZOJ 1579

    题意翻译 约翰一共有N)个牧场.由M条布满尘埃的小径连接.小径可 以双向通行.每天早上约翰从牧场1出发到牧场N去给奶牛检查身体. 通过每条小径都需要消耗一定的时间.约翰打算升级其中K条小径,使之成为高 ...

  8. windows 常用 命令

    Hyper-v管理               virtmgmt.msc 网络                         ncpa.cpl windows 远程登陆    mstsc.cpl C ...

  9. 奇妙的 clip-path 几何图形

    CSS 新属性 clip-path,意味裁剪路径的意思,让我们可以很便捷的生成各种几何图形. clip-path 通过定义特殊的路径,实现我们想要的图形.而这个路径,正是 SVG 中的 path . ...

  10. P2903 [USACO08MAR]麻烦的干草打包机The Loathesome Hay Baler

    传送门 题目问的是从出发点一直跑到终点的一条链上所有齿轮的速度和 其他的不用考虑 直接搜就好了 注意求的是绝对值之和,不是和的绝对值,所以不用考虑方向问题 注意 N<=1050 数组不要只开10 ...