之前我们都把数据 放在了 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. C++期中考试

    第一题1. 补足日期类实现,使得能够根据日期获取这是一年中第多少天.(12分) date.h #ifndef DATE_H #define DATE_H class Date { public: Da ...

  2. Go语言技术教程:Redis介绍安装和使用

    Redis介绍 我们日常的开发,数据都需要进行持久化存储,常见的持久化存储有很多种,比如数据库,文件,计算机内存,甚至云服务器等都是持久化存储数据的方式.而就数据库而言,经常又会被人们分为关系型数据库 ...

  3. [SinGuLaRiTy] 分治题目复习

    [SInGuLaRiTy-1025] Copyrights (c) SinGuLaRiTy 2017. All Rights Reserved. [POJ 1905] 棍的膨胀 (Expanding ...

  4. Shell学习日记

    if语句的使用 if语句的的格式: if [ expression ] expression 和方括号([ ])之间必须有空格,否则会有语法错误. then statments fi 或者: if [ ...

  5. Necklace of Beads POJ - 1286

    \(\color{#0066ff}{ 题目描述 }\) 一个圈上有n个珠子,有三种颜色可以染,问本质不同的方案数(通过旋转和翻转重合的算一种) \(\color{#0066ff}{输入格式}\) 多组 ...

  6. OpenCV&Qt学习之四——OpenCV 实现人脸检测与相关知识整理

    开发配置 OpenCV的例程中已经带有了人脸检测的例程,位置在:OpenCV\samples\facedetect.cpp文件,OpenCV的安装与这个例子的测试可以参考我之前的博文Linux 下编译 ...

  7. C++基础学习9:构造函数和析构函数

    1.  构造函数用来对类对象进行初始化,它完成对内存空间的申请.赋初值等工作.  2.  析构函数主要是用来做清理工作的. 补充:函数名或变量名前面有"::"但是没有类名,说明这是 ...

  8. 常用JS事件对象

    事件源对象event.srcElement.tagNameevent.srcElement.type 捕获释放event.srcElement.setCapture(); event.srcEleme ...

  9. CF .Beautiful numbers 区间有多少个数字是可以被它的每一位非零位整除。(数位DP)

    题意:数字满足的条件是该数字可以被它的每一位非零位整除. 分析:大概的思路我是可以想到的 , 但没有想到原来可以这样极限的化简 , 在数位dp 的道路上还很长呀 : 我们都知道数位dp 的套路 , 核 ...

  10. 待修改 URAL 1542

    #include<bits/stdc++.h> using namespace std; const int maxn = 2e5+2e4+11; const int dep = 666; ...