我正在编写一个页面，其中包含演示我的 js 库的使用的示例。我希望这些示例是可编辑和可运行的，所以我认为我有这些选项：
使用prettify在教程页面上显示代码，有一个按钮可以打开一个带有编辑器的新窗口，您可以在其中运行代码（当前实现的解决方案）。或者，我可以使编辑器成为某种模式对话框。
为页面上的每个示例使用多个 CodeMirror 编辑器（单个页面上最多可以有 30 个）。我不确定这些编辑器有多“重”，所以我不确定这是否是个好主意。
有一个编辑按钮，可以在需要编辑时用 CodeMirror 编辑器“交换”漂亮的代码，这样用户就可以编辑和运行示例，而无需担心新窗口。我不确定是否可以使美化和 CodeMIrror 的语法高亮看起来相同。
关于我应该如何做到这一点以及为什么这样做的任何想法？我也愿意接受有关不同代码编辑器或语法荧光笔的建议，所以如果有人有这种事情的经验，请告诉我你是如何做到的。