斗鱼扩展--localStorage备份与导出(九)
之前我们都把数据 放在了 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备份与导出(九)的更多相关文章
- mongodb 备份 还原 导出 导入
张映 发表于 2013-12-03 分类目录: nosql 标签:mongodb, 备份, 导入, 导出, 还原 mongodb数据备份和还原主要分为二种,一种是针对于库的mongodump和mong ...
- CSDN博客文章的备份及导出电子书CHM
需要用到的工具集合下载:http://download.csdn.net/source/2881423 在CSDN.百度等写博客文章的应该很多,很多时候担心服务器有一天突然挂了,或者担心自己的号被封了 ...
- mongodb 数据库操作--备份 还原 导出 导入（转）
mongodb 数据库操作--备份 还原 导出 导入 -------------------MongoDB数据导入与导出------------------- 1.导出工具:mongoexport ...
- 斗鱼扩展初识Chrome扩展(一)
看斗鱼有些时间了,也写了不少辅助的js,但是昨天不小心把硬盘分区表搞没了,自己写了好久的代码不见了,DiskGenius 也没恢复成功,所以要重写一次,大家要引以为鉴,常备份代码,github是个不错 ...
- mongodb数据库备份导入导出数据
备份数据: mongodump -h 192.168.2.20 -u game -p 12345678 -d dbname -o /data/test/ --excludeCollection=use ...
- mongodb 数据库操作--备份 还原 导出 导入
mongodb数据备份和还原主要分为二种,一种是针对于库的mongodump和mongorestore,一种是针对库中表的mongoexport和mongoimport 一,mongodump备份数据 ...
- mongodb数据库操作--备份 还原 导出 导入
首先数据库备份: mongodump -h IP --port 端口 -u 用户名 -p 密码 -d 数据库 -o 文件存在路径 mongodump -h 127.0.0.1 -u admin -p ...
- 推荐一款自己的软件作品[豆约翰博客备份专家]，新浪博客，QQ空间，CSDN，cnblogs博客备份，导出CHM,PDF(转载)
推荐一款自己的软件作品[豆约翰博客备份专 豆约翰博客备份专家是完全免费,功能强大的博客备份工具,博客电子书(PDF,CHM和TXT)生成工具,博文离线浏览工具,软件界面美观大方,支持多个主流博客网站( ...
- mongodb远程数据库的连接以及备份导入导出数据
环境win10; 运行cmd cd到目录mongodb的bin目录: 连接远程mongodb: 连接命令:mongo -u username -p pwd host:post/database(数据库 ...
随机推荐
- 浅谈UBUNTU
一 UBUNTU介绍 Ubuntu(乌班图)是一个以桌面应用为主的Linux操作系统,其名称来自非洲南部祖鲁语或豪萨语的"ubuntu"一词,意思是"人性".& ...
- Scrapy 中 Request 对象和 Response 对象的各参数及属性介绍
Request 对象 Request构造器方法的参数列表: Request(url [, callback=None, method='GET', headers=None, body=None,co ...
- springboot mybatis自定义枚举enum转换
原文链接:https://blog.csdn.net/u014527058/article/details/62883573 一.概述 在利用Spring进行Web后台开发时,经常会遇到枚举类型的绑定 ...
- LinkedList实现原理
原文链接:https://www.jianshu.com/p/56c77c517e71 本文对LinkedList的实现讨论都基于JDK8版本 Java中的LinkedList类实现了List接口和D ...
- 洛谷 P2141 珠心算测验
嗯... 先看一下这个题.... 题目描述 珠心算是一种通过在脑中模拟算盘变化来完成快速运算的一种计算技术.珠心算训练,既能够开发智力,又能够为日常生活带来很多便利,因而在很多学校得到普及. 某学校的 ...
- 04->python字典
字典dict 1.数据类型分类(按可变和不可变) 不可变数据类型:数字.bool.str.tuple 可变数据类型:list.dict.set 2.dict的组成 key:va ...
- C语言风格字符串的概念、定义、输入字符串、输出字符串
字符串: C语言中最有用.最重要的数据类型之一. 字符串:是以\0字符结尾的char类型数组.所以可以把数组和指针知识应用于字符串. 如何在程序定义字符串: 1.字符串字面量 用双引号括起来的内容称为 ...
- BZOJ 3083 遥远的国度 树链剖分+脑子
唉..又调了半天QWQ..为何读入挂了.....莫非读入是反着的????据ywy学长所言如是...OvO震惊 这啥骚题啊...还要换根...不过清明讲过...(然鹅我现在才做... 先随便选个点(比如 ...
- P2905 [USACO08OPEN]农场危机Crisis on the Farm
传送门 DP 设 f [ i ] [ j ] [ k ] 表示已经走了 i 步,向上走了 j 步,向右走了 k 步时能拯救的最多奶牛数(j,k可以为负,表示反向) 设 g [ i ] [ j ] 表示 ...
- C#工具类之字符串扩展类
/// <summary> /// 字典串帮忙类 /// </summary> public static class StringHelper { /// <summa ...