Edge 浏览器开发 JavaScript 脚本

最近有在尝试开发简单的油猴脚本，用于帮助我实现一些简单的自动话操作。

直接在油猴提供的编辑器里面写代码其实体验已经很好了，但是它也有一些缺点，就是我在想要运行代码的时候总是要经历 ·保存·->·切换选项卡·->刷新的操作，在一些场景下我还希望能够保存我之前的变量。很是麻烦，此时便感觉到的油猴不够用了。

最近无聊在随便点 Edge 浏览器的开发者工具的时候发现一篇新大陆：

文件系统和替代都很适合前端在开发时替换本地的静态开发资源，这里我重点讲一下”片段“ 这个选项卡的作用。

它有点像 ”JavaScript 草稿纸“ ， 之前用 Firefox 的时候发现有这么个东西的时候还高兴了好半天。当时就很纳闷 Chrome 上为什么没有，我还兴致冲冲的找了好半天。可怜我的五毛钱英语，人家是叫这个东西：

其实这里就是一个JavaScript 代码草稿纸的东西，我们可以在新建 JavaScript 脚本，然后编写代码并且在当前页面上不断运行调试。


很方便的有没有，下面断点调试，控制台什么的一应俱全。一言蔽之，在这里你可以“为所欲为”。

如何配合油猴进行油猴脚本开发呢?

1. 新建一个油猴脚本，并且设置好要引入的资源
   

// @name         测试脚本
// @version      0.1
// @match        https://csdn.net/*
// @require      https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.js

2. 然后打开对应的你设置的页面，并确认你的油猴脚本正常运行。
   
3. 打开控制台,切换到源代码选项卡。
   
   然后切换到片段子选项卡，新建片段，然后编写代码。在需要运行的时候使用快捷键 Ctrl+Enter 即可运行。

如果有代码不确认是什么样的结果的话下面还有控制台，怎么是不是很方便。

实测其实油猴引入的资源无法在片段中获取到，这里给出另外一个解决方案，是通过 <script>标签手动引一下：

var o = document.getElementsByTagName("body")[0];
o || (o = document.createElement("body"), document.documentElement.appendChild(o));
var a = document.createElement("script");
a.src = "https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.js",
a.type = "text/javascript",
a.id = "injected_script",
o.appendChild(a)