CodeMirror 在线代码编辑器
像百度编辑器插件部分、菜鸟教程示例等高德地图都在使用,这里也记录一下:
CodeMirror是一个用于编辑器文本框textarea代码高亮javascript插件......
vue 中使用 参见:
https://www.npmjs.com/package/vue-codemirror
https://blog.csdn.net/oumaharuki/article/details/79268498
普通使用例如:
<!doctype html> <title>CodeMirror</title> <meta charset="utf-8" /> <link rel="stylesheet" href="codemirror.css"> <script src="codemirror.js"></script> <script src="xml.js"></script> <article> <form style="border:1px solid red;"> <textarea id="code" name="code"> This is an example of EJS (embedded javascript) <p>The program says <%= hello("world") %>.</p> <script> alert("And here is some normal JS code"); // also colored </script> <div>addd</div> </textarea> </form> <script> var editor = CodeMirror.fromTextArea(document.getElementById("code"), { lineNumbers: true, mode: "text/html", indentUnit: 4, indentWithTabs: true }); editor.on("change", function (Editor, changes) { console.log('test') console.log(Editor) console.log(changes) console.log(editor.getValue()) }); </script> </article>
使用手册:http://codemirror.net/doc/manual.html
github地址:https://github.com/marijnh/codemirror
使用方法等,可见前辈整理:
CodeMirror 使用大全 https://www.cnblogs.com/onlyonely/p/4450029.html