且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

将Chrome调试器里的JavaScript变量保存成本地JSON文件

更新时间:2022-09-16 09:38:31

我们在Chrome开发者工具的Console标签页里,可以输入JavaScript变量然后回车,查看这些变量的值。


比如我用类jQuery选择器的语法 var button = $(‘button’)来返回当前页面所有button标签的实例。


将Chrome调试器里的JavaScript变量保存成本地JSON文件


如果我想将这个变量保存到本地,以备以后进一步分析,一种做法是用JSON.stringfy将其序列号成JSON字符串,然后再手动选中该字符串,新建一个本地文件,复制进去并保存。

将Chrome调试器里的JavaScript变量保存成本地JSON文件



这套办法可行但是太麻烦了。现在我向大家分享一种自动化的做法。

将Chrome调试器里的JavaScript变量保存成本地JSON文件将Chrome调试器里的JavaScript变量保存成本地JSON文件将Chrome调试器里的JavaScript变量保存成本地JSON文件把这段代码粘贴到Chrome开发者工具的console标签页执行,给标准的console对象新增一个save方法。这个方法有两个输入参数,第一个为待保存成本地JSON文件的JavaScript变量,第二个参数为本地JSON文件的名称。


还是回到上面的例子,我在Chrome开发者工具的console页面执行了上述的JavaScript代码后,紧接着再执行下面的语句:


console.save(button, “button.json”);


将Chrome调试器里的JavaScript变量保存成本地JSON文件


回车,Chrome自动弹出一个JSON文件保存窗口:


将Chrome调试器里的JavaScript变量保存成本地JSON文件


保存到本地即可。这种方式省去了手动将JavaScript变量序列化成JSON string再手动保存成本地文件的工作量,提升了程序员的工作效率。