之前我们都把数据 放在了 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. 分区表分区字段的update操作

    默认情况下,oracle的分区表对于分区字段是不允许进行update操作的,如果有对分区字段行进update,就会报错——ORA-14402: 更新分区关键字列将导致分区的更改.但是可以通过打开表的r ...

  2. RPM软件包管理以及使用方法

    Red Hat Package Manager(简称RPM)工具包由于其使用简单操作方便,可以实现软件的查询.安装.卸载.升级和验证等功能,为Linux使用者节省大量的时间,所以被广泛的用于Linux ...

  3. P2948 [USACO09OPEN]滑雪课Ski Lessons

    题意:Bessie去滑雪,限时T,滑雪场有S节课 每节课开始于$m_i$,长度为$l_i$,可以将Bessie的能力值变成$a_i$(注意是变成不是增加) 有n个滑雪坡,去滑雪需要$c_i$的能力,并 ...

  4. kuangbin专题七 ZOJ1610 Count the Colors (灵活线段树)

    Painting some colored segments on a line, some previously painted segments may be covered by some th ...

  5. 合并queryset

    今天在实现搜索时遇到一个问题,如何同时搜索model里面的title以及content和category字典 contents = Blog.objects.filter(content__conta ...

  6. IE下 checkbox、radio等标签的label中的img点击无效(点击不能选中)问题解决

    类似以下代码,点击图片不能选中checkbox <input id="dw_1" name="shape[]" value="Round&quo ...

  7. element,点击查看,实现tab切换:

    点击查看,实现tab切换: 代码如下: <template> <div> <el-table :data="tableData" style=&quo ...

  8. 老男孩python作业3-购物车程序优化

    购物车优化要求:用户入口: 1.商品信息存在文件里 2.已购商品,余额记录.第一次启动程序时需要记录工资,第二次启动程序时谈出上次余额 3.允许用户根据商品编号购买商品 4.用户选择商品后,检测是否够 ...

  9. Jury Jeopardy (这是一道单纯的模拟题)

    Description What would a programming contest be without a problem featuring an ASCII-maze? Do not de ...

  10. Helvetic Coding Contest 2016 online mirror A1

    Description Tonight is brain dinner night and all zombies will gather together to scarf down some de ...