codeMirror 使用教程

codeMirror 官网/下载： http://codemirror.net/index.html

下载解压之后，你所需要的folder有两个：lib,mode. 将这两个文件夹拷贝到项目中，在你需要做代码高亮的页面内引入lib文件夹中的css和js文件，以及你所需要的codeMirror mode下的js文件.

<link type="text/css" href="${ctx}/static/thirdparty/codemirror/lib/codemirror.css" rel="stylesheet" />
<script type="text/javascript" src="${ctx}/static/thirdparty/codemirror/lib/codemirror.js"></script>
<script type="text/javascript" src="${ctx}/static/thirdparty/codemirror/mode/sql/sql.js"></script>
<script type="text/javascript">
$(function(){var mime="text/x-mysql";window.editor = CodeMirror.fromTextArea(document.getElementById('sql'), {mode: mime,indentWithTabs: true,smartIndent: true,lineNumbers: true,matchBrackets : true,autofocus: true});
});
</script>

ok,现在可以看看效果了。

codeMirror支持多种代码高亮的mode，可以看看mode/index和meta两个文件，你会发现更多。

codeMirror 使用教程相关推荐

html文本框代码高亮,CodeMirror 编辑器文本框 TextArea 代码高亮插件 - 文章教程
CodeMirror 是一个用于编辑器文本框 TextArea 代码高亮 JavaScript 插件,为各种编程语言实现关键字.函数.变量等代码高亮显示,丰富的 API 和可扩展功能以及多个主题样式, ...
typora修改主题字体、代码块字体、行内块代码字体大小、引用块字体大小、代码块背景颜色、文章可写区域宽度以及修改教程
目录 0. 授人以渔 1.主题字体 2.代码块字体大小 3.引用块字体大小 4.代码块背景颜色 ①pink老师的样式代码 ②自己搜到的样式 5.块代码字体大小 6.修改文章可写区域的宽度 0. 授人以 ...
【Markdown基础教程】编辑环境的下载
在说这个之前,我们需要高清一件事你需不需要客户端为什么这么问呢,因为Markdown有很多网页版的编辑器,开箱即用~ 如果你想下载客户端,有个应用的话,可以先跳过下面部分 Markdown的网页编辑 ...
codemirror6教程
codemirror6教程文章目录 codemirror6教程两个概念编辑器视图编辑器状态安装Codemirror6 EditorState 创建 EditorView 创建 Compart ...
vue集成codemirror代码编辑器
点击上方" 青年码农 "关注回复"特效源码"可获取各种资料 CodeMirror是一个用 JavaScript 为浏览器实现的通用文本编辑器.它专门用于编辑代 ...
c4d python使用方法_c4d 有没有python的技术说明文档_c4d python插件安装教程
用python编程操作C4D和直接使用C4D进行操作有什么区别? 没什么区别吧.其是C4D提供了python绑定,方便python的人开发方便. 很多软件都提供了一言绑定或者自己的语言,比如autoc ...
Electron 入门教程
整个教程不涉及过于深入的知识,通过一系列c操作能够运行一个简单的MarkDown编辑器.在整个过程中体会Electron的作用,对于我来说就是把整个网页和浏览器打包成一个程序了,简单说可能就是我们常说 ...
02引言-AngularJS基础教程
0. 目录目录前言正文 1 AngularJS 难或易 2 您需要Angular吗 3 使用Angular的理由 4 关于本书 5 接下来声明 1. 前言 AngularJS是为了克服HTML ...
Java WebIDE：CodeMirror+Vue+JavaCompiler
课上JavaEE,老师直接用了大佬的教程. Vue + Spring Boot 项目实战: https://blog.csdn.net/Neuf_Soleil/article/details/8892 ...

codeMirror 使用教程

codeMirror 使用教程相关推荐

最新文章

热门文章