华丽的网上突出代码组件CodeMirror

时间:2023-03-09 17:03:32
华丽的网上突出代码组件CodeMirror

农民之间的代码懒惰性质:愚公绝不能过夜。一劳永逸永远不知疲倦!这是一个代码示例 动态配置,在不同的场景抽象为常见的配置逻辑加,这使得有可能“为一个全球性的代码。代码做搬运工”,更糟糕的是特殊的代码已经成为一个动态负载(让我们用Groovy, Clojure做动态负载)。置动态代码时,总得把代码上传到server。假设代码是通过贴到上传页面的话。Textarea里的代码可没有IDE下那么婀娜多姿。要想好看就得想办法!

在线代码高亮组件 正在灯火阑珊处....

在线代码高亮组件有非常多,特别是Wordpress朋友圈的,纯js也有,CodeMirror就是当中一枚。

CodeMirror是一个提供多功能。多语言的在线代码高亮编辑组件。

简单的几行javascript 就能达到IDE的效果.

 var javaEditor = CodeMirror.fromTextArea(document.getElementById("java-code"), {
lineNumbers: true,
matchBrackets: true,
mode: "text/x-java"
});

仅仅要在html的页面有一个id为java-code的textarea。再加上面的代码就能有以下的效果:

华丽的网上突出代码组件CodeMirror

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdG9iZXJvYw==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" alt="">

这家伙眼下支持60种不同的语言代码高亮,高大上~~~

CodeMirror是开源的。全部的源代码跟样例在放在Github上面,任君取用!

门牌号是: https://github.com/marijnh/codemirror

版权声明:本文博主原创文章。博客,未经同意不得转载。