市场定位怎么写HTML5实现本地JSON⽂件的读写
参考：
（FileReader读取json⽂件，FileSaver.js保存json⽂件）
（ActiveXObject 这玩意根本不能⽤，IE10 和 Chrome都试了）红色经典作品
（FileSaver和FileWriter都是不能直接修改保存指定⽂件的，只能⽣成⼀个⽂件，然后浏览器以"下载"的形式保存）
想⽤Egret来做地图编辑器来着，需要打开地图配置，编辑地图后，再保存地图配置。
所以去⽹上搜了⼀圈json的读取和保存⽅法。
⼀、读取本地JSON⽂件
1. ⾸先使⽤标签<input>创建⼀个读取的按钮
2. 然后选择本地的json⽂件后使⽤FileReader读取json⽂件的内容，此时读取的结果是字符串
3. 将读取的结果字符串使⽤JSON.par转为json格式，之后再使⽤
<div>
<input type="file" id="files"/>
</div>
听了会开心的歌
<script>
var inputElement = ElementById("files");
inputElement.addEventListener("change", handleFiles, fal);
function handleFiles() {
var lectedFile = ElementById("files").files[0];//获取读取的File对象
var name = lectedFile.name;//读取选中⽂件的⽂件名
var size = lectedFile.size;//读取选中⽂件的⼤⼩
console.log("⽂件名:"+name+"⼤⼩："+size);
var reader = new FileReader();//这⾥是核⼼读取操作就是由它完成的。
console.log("读取结果：", sult);//当读取完成之后会回调这个函数，然后此时⽂件的内容存储到了result中。直接操作即可。 console.log("读取结果转为JSON：");
秋冬穿搭let json = JSON.sult);
console.log(json.name);
河南十大特产
console.log(json.age);
};
}
</script>
实际操作步骤
使⽤<input>标签创建的按钮如下图
点击“选择⽂件”，打开本地test.json⽂件，test.json内容如下图：
读取后console.log输出结果如下：
⼆、JSON⽂件的保存
⽹上搜了⼀圈，有个new ActiveXObject("Scripting.FileSystemObject");⽅法，但是没有什么⽤。
使⽤下⾯的代码进⾏JSON保存
1. 引⼊FileSaver.js⽂件 (可以从⽂章开头那去找下载链接)
2. 使⽤<input>标签创建⼀个保存按钮
2. 点击<input>标签保存时，调⽤saveAs⽅法保存json内容
<script type="text/javascript" src="./js/FileSaver.js" chart="utf-8"></script>
<input type="button" id="export" value="保存"/>
<script>
var button = ElementById("export");
button.addEventListener("click", saveHandler, fal);
function saveHandler(){
美丽的岛屿let data = {
name:"hanmeimei",
age:88
}
var content = JSON.stringify(data);
var blob = new Blob([content], {type: "text/plain;chart=utf-8"});
saveAs(blob, "save.json");
}
</script>
实际操作步骤
<input>标签创建保存按钮
浏览器提⽰下载save.json⽂件
下载保存后的⽂件
三、疑问
1. 为什么保存的时候不能直接保存打开的json⽂件，还需要"下载"这⼀步。
我没有去深究，估摸着这是安全权限问题，因为如果浏览器能任意修改你电脑上的⽂件，那是⽐较可怕的。
2. 在Egret中如何使⽤
⾸先这些input标签必须创建在egret的div之前
然后这些标签必须得隐藏起来，不然会盖在游戏canvas只上，很难控制显⽰和隐藏
<input type="file" id="files" />
因为标签按钮被隐藏了你没法点，在Egret⾥⽤代码控制<input>主动调⽤click事件，来触发打开⽂件和保存的操作，这样⽐较灵活。
//打开本地⽂件幽默个性签名笑死人
室外效果图private onOpenFile(){
var files= ElementById("files");
files.click();
}
//选定本地⽂件
private onChang(){
//获取打开的⽂件，并进⾏操作
var files: any = ElementById("files"); var file = files.files[0];
}
