ACE 是一个开源的、独立的、基于浏览器的代码编辑器,可以嵌入到任何web页面或JavaScript应用程序中。ACE支持超过60种语言语法高亮,并能够处理代码多达400万行的大型文档。ACE开发团队称,ACE在性能和功能上可以媲美本地代码编辑器(如Sublime Text、TextMate和Vim等)。

ACE是Mozilla Skywriter(以前称为Bespin)项目的继任者,并作为Cloud9的主要在线编辑器。

以下是它的详细特性:

  • 可以对60多种语言进行语法着色(可以导入TextMate/Sublime/.tmlanguage 文件)
  • 20多种主题(可以导入TextMate/Sublime/.tmtheme文件)
  • 自动缩进,减少缩进
  • 一个可选的命令行
  • 处理巨大的文件,可以处理4,000,000行代码
  • 完全自定义的键绑定,包括V正则表达式搜索和替换
  • 高亮匹配括号
  • 软标签和真正的标签之间切换
  • 显示隐藏的字符
  • 用鼠标拖放文本
  • 换行
  • 代码折叠
  • 多个光标和选择
  • 实时语法检查器(支持 JavaScript/CoffeeScript/CSS/XQuery)
  • 剪切,复制和粘贴功能IM和Emacs模式

项目地址:

  1. git clone git://github.com/ajaxorg/ace.git

相关项目:

使用引导:

1、引入

  1. var ace = require("lib/ace");

2、设置主题

  1. editor.setTheme("ace/theme/twilight");

3、设置程序语言模式

  1. editor.getSession().setMode("ace/mode/javascript");

4、一般常用操作
设置、获取内容:

  1. editor.setValue("the new text here"); // or session.setValue
  2. editor.getValue(); // or session.getValue

获取选择内容:

  1. editor.session.getTextRange(editor.getSelectionRange());

在光标处插入:

  1. editor.insert("Something cool");

获取光标所在行或列:

  1. editor.selection.getCursor();

跳转到行:

  1. editor.gotoLine(lineNumber);

获取总行数:

  1. editor.session.getLength();

设置默认制表符的大小:

  1. editor.getSession().setTabSize(4);

使用软标签:

  1. editor.getSession().setUseSoftTabs(true);

设置字体大小,这个其实不算API:

  1. document.getElementById('editor').style.fontSize='12px';

设置代码折叠:

  1. editor.getSession().setUseWrapMode(true);

设置高亮:

  1. editor.setHighlightActiveLine(false);

设置打印边距可见度:

  1. editor.setShowPrintMargin(false);

设置编辑器只读:

  1. editor.setReadOnly(true); // false to make it editable

5、触发尺寸缩放
编辑器默认自适应大小,如果要程序控制resize,使用如下方法:

  1. editor.resize();

6、搜索

    1. editor.find('needle',{
    2. backwards: false,
    3. wrap: false,
    4. caseSensitive: false,
    5. wholeWord: false,
    6. regExp: false
    7. });
    8. editor.findNext();
    9. editor.findPrevious();

下列选项可用于您的搜索参数:
needle: 要查找的字符串或正则表达式
backwards: 是否反向搜索,默认为false
wrap: 搜索到文档底部是否回到顶端,默认为false
caseSensitive: 是否匹配大小写搜索,默认为false
wholeWord: 是否匹配整个单词搜素,默认为false
range: 搜索范围,要搜素整个文档则设置为空
regExp: 搜索内容是否是正则表达式,默认为false
start: 搜索起始位置
skipCurrent: 是否不搜索当前行,默认为false
替换单个字符:

  1. editor.find('foo');
  2. editor.replace('bar');

替换多个字符:

  1. editor.replaceAll('bar');

editor.replaceAll使用前需要先调用editor.find('needle', ...)
7、事件监听
监听改变事件:

  1. editor.getSession().on('change', function(e) {
  2. // e.type, etc
  3. });

监听选择事件:

  1. editor.getSession().selection.on('changeSelection', function(e) {
  2. });

监听光标移动:

  1. editor.getSession().selection.on('changeCursor', function(e) {
  2. });

8、添加新命令、绑定按键
要指定键绑定到一个自定义函数:

    1. editor.commands.addCommand({
    2. name: 'myCommand',
    3. bindKey: {win: 'Ctrl-M', mac: 'Command-M'},
    4. exec: function(editor) {
    5. //...
    6. },
    7. readOnly: true // 如果不需要使用只读模式,这里设置false
    8. });

详细API:http://ace.c9.io/#nav=api

原文链接:http://www.cnblogs.com/cz-xjw/p/6476179.html

ACE Editor 常用Api(转)的更多相关文章

  1. 【前端】ACE Editor 简易使用示例

    身为一个早已退役的Oier,当然忘不了当年一个个OJ页面上的代码显示和代码编辑器. 其中,洛谷使用的ACE Editor就是之一,非常的简洁美观.以及实际上在前端页面上搭建一个ACE Editor也是 ...

  2. 常用API接口汇总

    下面列举了100多个国内常用API接口,并按照 笔记.出行.词典.电商.地图.电影.即时通讯.开发者网站.快递查询.旅游.社交.视频.天气.团队协作.图片与图像处理.外卖.消息推送.音乐.云.语义识别 ...

  3. 【前端】ACE Editor(代码编辑器) 简易使用示例

    身为一个早已退役的Oier,当然忘不了当年一个个OJ页面上的代码显示和代码编辑器. 其中,洛谷使用的ACE Editor就是之一,非常的简洁美观.以及实际上在前端页面上搭建一个ACE Editor也是 ...

  4. html5 canvas常用api总结(一)

    1.监听浏览器加载事件. window.addEventListener("load",eventWindowLoaded,false); load事件在html页面加载结束时发生 ...

  5. compass General 常用api学习[Sass和compass学习笔记]

    compass 中一些常用api 包括一些浏览器hack @import "compass/utilities/general" Clearfix Clearfix 是用来清除浮动 ...

  6. java基础3.0:Java常用API

    本篇介绍Java基础中常用API使用,当然只是简单介绍,围绕重要知识点引入,巩固开发知识,深入了解每个API的使用,查看JavaAPI文档是必不可少的. 一.java.lang包下的API Java常 ...

  7. codemirror和ace editor的语法高亮

    两个javascript库用做在线代码编辑器都是非常优秀的选择 我这两天对这两个类库做了简单的研究,重点是语法高亮的自定义: ace editor的主要思路是生成状态机,从一个startstate开始 ...

  8. C++ 中超类化和子类化常用API

    在windows平台上,使用C++实现子类化和超类化常用的API并不多,由于这些API函数的详解和使用方法,网上一大把.本文仅作为笔记,简单的记录一下. 子类化:SetWindowLong,GetWi ...

  9. node.js整理 02文件操作-常用API

    NodeJS不仅能做网络编程,而且能够操作文件. 拷贝 小文件拷贝 var fs = require('fs'); function copy(src, dst) { fs.writeFileSync ...

  10. js的常用api

    JavaScript常用API总结 原创 2016-10-02 story JavaScript 下面是我整理的一些JavaScript常用的API清单. 目录 元素查找 class操作 节点操作 属 ...

随机推荐

  1. 在vite中怎么批量注册组件

    1. 在webpack中使用require来获取组件 / 参数:1. 目录 2. 是否加载子目录 3. 加载的正则匹配 //匹配当前文件夹下的所有.vue文件 注册全局组件 const importF ...

  2. HTML学习笔记3----制作一个简易网站

    随笔记录方便自己和同路人查阅. #------------------------------------------------我是可耻的分割线--------------------------- ...

  3. 项目中pom.xml的某些坐标无法加载

    项目中pom.xml的某些坐标无法加载 maven官方查找对应的坐标文件下载 https://mvnrepository.com/artifact/com.fasterxml.jackson.core ...

  4. AD中添加原理图文档模板-转载

    (24条消息) AD中添加原理图文档模板_shuguang552的博客-CSDN博客_ad原理图模板

  5. opencv对图片画框写文字

    业务背景:对图片进行画框后调用排序方法按照"从上到下,从左到右"对已经画的框进行排序.排序方法当前有缺陷,修复后需要验证. 目前有如下信息: 原始图片地址 图片对应的每个框的坐标( ...

  6. cmd执行程序时容易卡住阻塞以及解决方式

    遇到问题: cmd执行程序时总是卡住,敲回车后继续执行程序. 我司公众号需要去内网获取数据,cmd执行了内网穿透程序,期间cmd两次卡住,公众号无法获取内网数据导致无法运行. 解决方案: cmd默认开 ...

  7. Pytest之参数化

    在unittest测试中,有参数化的概念,那么在pytest中也有. 如何理解参数化: 当对一个测试函数进行测试时,通常会给函数传递多组参数.比如测试账号登陆,我们需要模拟各种千奇百怪的账号密码.可以 ...

  8. 【BOOK】Ajax数据爬取

    Requests获取原始HTML文档,Ajax加载和JavaScript处理的数据无法获得 一.Ajax Ajax-异步的JavaScript和XML Ajax请求页面更新: 1. 发送请求 2. 解 ...

  9. Linux python后台任务

    Ubuntu 后台持续运行python服务 一般使用 nohup python -u app.py>t.log 2>&1 & nohup python3 -u app.py ...

  10. win10查看笔记本电池性能

    要生成电池报告,可以按Windows + R,窗口中输入 cmd 回车. 在提示符处输入: Powercfg /batteryreport,回车. 就可以在C盘看到性能报告文件.