分类
工具周边

Emacs 入门指南:基本编辑命令:移动光标

Emacs splash screen

基本编辑命令

Emacs 让用户能够快速高效地工作,其方法之一就是提供在文本间移动,和操作文本的高阶命令。这些命令可以应用于字符、单词、行、句子、段落、页面、函数定义、空白处等。我们可以在任何阅读或编辑文本的地方使用它们:源代码、网页、shells、目录列表、电子邮件消息等。

在缓冲区中移动{光标}

最基本的缓冲区移动命令按行或列(字符)移动焦点(光标):

C-f 前移一个字符
C-n 移动至下一行
C-b 后移一个字符
C-p 移动至上一行

下面是一些在较大区块上移动光标的方法[1]

C-a 移动至行首
M-f 前移一个词
M-a 移动至上一句
M-v 移动至上一屏
M-< 移动至缓冲区头部
C-e 移动至行末
M-b 后移一个词
M-e 移动至下一句
C-v 移动至下一屏
M-> 移动至缓冲区尾部

当你习惯了这些按键,使用起来会比其它应用程序中的等价按键( Home、End、Ctrl+Left 等),更为得心应手,因为双手不必离开基本输入位置。而在缓冲区中,按键{操作}远比使用鼠标来回移动更为迅速。

Emacs& nbsp;提供了额外的命令,以在特定上下文情境下移动光标(例如在编写源代码时,有专用命令移动光标到上一个或下一个函数定义处)。

因为上述许多命令都是将光标移动到,当前位置的一个相对位置上,所以我们可以反复使用它们(如 C-p C-p C-p 回退三行)。还可以用前缀参数节约时间:C-u 后跟一个数字和一个移动命令,表示将该命令重复执行指定次数。可以使用 M-[digit] 代替 C-u [digit] 。如果使用 C-u 时没有指定数字,默认值为4。当我们不知道需要移动的准确次数时,省略数字可以节省时间。

C-u 3 C-p 向上移动3行
C-u 10 C-f 前移10个字符
M-1 M-0 C-f 前移10个字符
C-u C-n 向下移动4行
C-u C-u C-n 向下移动16行
C-u C-u C-u C-n 向下移动64行

光标也可以直接跳转到缓冲区的指定行上:

M-g g 跳转到指定行

查找文本是在缓冲区中移动的快捷方法。可以将查找看作是另一种形式的移动。我们在查找特定元素时,可以使用渐进式搜索直接跳转到相应位置,而不必逐行或逐页查看。有关搜索的问题后面会详细说明。

C-s 渐进式正向搜索
C-r 渐进式反向搜索

在缓冲区移动光标的另一种方法是使用标记

未完待续……

分类
工具周边

Emacs 入门指南:文本操作

文本操作功能

Emacs 提供了大量操作文本的工具,同时也有方法呈现文本中的各种信息。下面是一个例子:

M-x dired 在所选目录中启动 Dired 文件管理器模式。然后按下 C-x C-q(或  M-x wdired-change-to-wdired-mode)切换到可编辑Dired 模式:

Close-up of a directory listing in Editable Dired mode.

在这种模式下,更改右栏文件名,然后键入 C-x C-s(“保存”)即可实现指定文件的重命名。重命名文件与编辑文本一样容易。批量重命名(例如,重命名形如 icon_* 的文件为 backup_icon_*)与执行查找和替换一样容易(M-x query-replace M-%),我们不需要学习如何使用一个单独的批量重命名工具。

在 Emacs 中,与我们进行交互的不仅包括文件和目录,还有系统工具、编译器、调试器、个人信息管理器、网页、电子邮件、聊天应用,以及其它各种互联网服务等,而且有一个第三方工具系统为我们提供更多的功能特性。正是由于这种整合性,Emacs 的优势得以体现:我们所学会的任意一项编辑功能(例如查找和替换),都可以在各种不同场景下得到应用。

未完待续……

分类
工具周边

Emacs 入门指南:说明

为何使用 Emacs ?

Emacs 为各种不同类型的任务提供了一个整合环境,使人们工作起来更高效:

  • 基本编辑命令一应俱全(数量那是相当多),足以应付各种任务:写代码、读手册、使用 shell 或撰写电子邮件等。
  • 用于打开、保存、搜索和处理文本的各项工具 Emacs 均有提供。

这种一致性意味着在 Emacs 中工作,往往会比{为每项任务分别}学习使用一种单独的程序,来得更为便捷,因为每个程序通常定义有各自不同的编辑功能集合,以及{不同的}快捷键设定。

如果对 Emacs 的工作方式不完全满意,我们可以使用 Emacs Lisp(Elisp)语言来定制 Emacs 、自动执行日常任务或添加新功能。Elisp 很容易上手且非常强大:可以用于变更或扩展几乎所有的 Emacs 功能。通过编写 Elisp 代码{进行扩展},Emacs 无所不能。关于这一论点,其论据是,上一节介绍的所有功能(以及本文此后将论及的更多特性)都是以 Elisp 编写而成。

Emacs 同样具有可移植性。我们能在 Windows、GNU/Linux、Mac OS,以及许多其它平台上以相同配置运行 Emacs。

在我们开始之前…

如果已经装好 Emacs,我们可以按照本文介绍的例子学习使用它。开始使用 Emacs 之前,请务必阅读 Emacs 自带的教程。该教程提供了一种交互式实践过程,来让我们熟悉许多基本操作,包括:

  • 启动和退出 Emacs
  • 基础文本操作和编辑命令
  • 打开和保存文件
  • Emacs 概念:窗格、窗体、文件和缓冲区
  • 通过 M-x 快捷键调用命令

要运行此教程,只需启动 Emacs 并输入 C-h t,亦即,按下 Ctrl-h 键之后再按 t 键。

教程中所描述的全部功能特性都可以运行于 GNU Emacs 第23版之上。而某些功能不包括在 Emacs 早期版本中,但是可以单独安装。

有时我们会说:

获取更多信息,请查阅 (info "(emacs)Using Region")

这是指 Emacs 手册中的一页,我们可以通过点击链接阅读其内容。另外,我们还可以通过 Emacs 内置的文档阅读器直接访问这些页面,我们称之为信息。要做到这一点,首先按下 M-:,然后输入 (info "(emacs)Using Region"),最后按下 RET 键{回车}:

Info mode screenshot

Emacs 手册是学习 Emacs 的最佳资源,我们可以输入 C-h r 来阅读它。我们也可以在网上阅读该手册

Emacs 还有许多其它的帮助功能,其中一部分将在后面介绍。输入 C-h C-h 可以查看全部帮助项目列表。

分类
工具周边

Emacs 入门指南:引言

今起我将陆续发布 Emacs 官方使用指引 A Guided Tour of Emacs 的译文《Emacs 入门指南》,需要说明的是,本翻译完全出于兴趣爱好,与 Emacs 官方中文翻译组无关。

Emacs 入门指南翻译说明

为了使读者们能够快速准确地理解本文内容,在此首先对下面译文中出现的一些特别格式作出说明。

  • 原文已有的圆括号,即:(),在译文中原样保留,即:()。
  • 花括号内的文字是为了便于理解由译者添加的,即:{文本}。
  • 方括号加数字用于为译注标号,对应“Emacs 入门指南译注”一节的内容,即:[2]。
  • 本文提及的 meta/M 键对应 PC 的 Alt 键。

Emacs 入门指南

Emacs splash screen

GNU Emacs 手册将 Emacs 定义为可扩展、可定制、自文档化的实时显示编辑器,但如此描述并未告诉初学者们 Emacs 能做哪些事情。为了让读者们就 Emacs 建立起一定的感性认识,下面列举一些能够借助 Emacs 完成的事务:

除了能编辑纯文本文件,Emacs 还可以编写各种不同的人类语言和编程/标记语言:

'Hello' in various languages

Syntax highlighting in Latex mode

Syntax highlighting in C mode

(点击查看原始图片。)

… 以及作为编译、运行和测试程序的工具。Emacs 可以整合 GDB 提供集成开发环境( M-x gdb ):

GDB mode screenshot

Emacs 还可以比较两个文件,并高亮不同之处( M-x ediff ):

Ediff mode screenshot

Emacs 既是一个文件管理器( M-x dired ):

Close-up view of Dired

Emacs 又是新闻、电子邮件和 RSS 源的阅读器( M-x gnus ):

Gnus screenshot

更有甚者,我们用 Emacs 玩玩俄罗斯方块也没问题( M-x tetris ):

Tetris screenshot

通过以上事例我们不难理解,为什么有些人认为 Emacs 不仅仅是一个文本编辑器,而几乎是一个完整的操作系统了。有些用户觉得自己可以用 Emacs 完成几乎全部工作。

未完待续……

分类
工具周边

『WordPress』条件加载JavaScript脚本实现SyntaxHighlighter语法高亮

在前不久发布的《SyntaxHighlighter:无需插件的语法高亮解决方案》一文中,我们介绍了Syntax Highlighter的用法,通过调用远程javascript脚本实现了语法高亮效果。接下来我们要谈谈如何对其进行优化。

syntax-highlighter-conditional-loading

场景

考虑到代码高亮仅在特定场合使用,亦即,仅当页面存有需要高亮展示的代码时。因此,我们只需在相应页面加载渲染用的javascript脚本即可,而无需在全部页面调用,如此一来可以进一步优化页面加载时间。

分析

于是我们的问题转化为:如何对带有代码的页面进行判断呢?以本站为例,与代码有关的文章都归属在分类“程序人生”及其子目录下,因而,我们可以在加载javascript时,对这一条件进行判断,然后选择是否进行Syntax Highlighter脚本的调用。我们通过WordPress提供的Conditional Tags不难解决这个问题。

方案

整个解决方案分两大步骤进行:

  1. 判断日志是否归属于某一分类或其子目录。
    这里我们需要构造一个做出此条件判定的函数。幸运的是,WordPress已经给出了答案,即:
    function post_is_in_descendant_category( $cats, $_post = null )
    {
    	foreach ( (array) $cats as $cat ) {
    		// get_term_children() accepts integer ID only
    		$descendants = get_term_children( (int) $cat, 'category');
    		if ( $descendants && in_category( $descendants, $_post ) )
    			return true;
    	}
    	return false;
    }

    我们只需将此函数附加到主题的function.php文件中即可。

  2. 修改header.php,利用上述函数判断并加载Syntax Highlighter的javascript脚本。

    首先我们利用WordPress的wp_enqueue_script函数,加上上面的条件判断函数,加载JS脚本,注意参数为分类ID:

    // 仅当显示指定目录或其子目录下的日志时才加载脚本。
    if ( in_category(100) || post_is_in_descendant_category(100) ) {
    	wp_enqueue_script('shCore', 'http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js');
    	wp_enqueue_script('shBrushPhp', 'http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPhp.js');
    	wp_enqueue_script('shBrushSql', 'http://alexgorbatchev.com/pub/sh/current/scripts/shBrushSql.js');
    	wp_enqueue_script('shBrushXml', 'http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js');
    }

    然后象往常一样加载CSS并调用使Syntax Highlighter生效的all()函数:

    <!-- Syntax Highlighter CSS -->
    <?php if ( in_category(100) || post_is_in_descendant_category(100) ) { ?>
    <link rel="stylesheet" type="text/css" href="http://alexgorbatchev.com/pub/sh/current/styles/shCore.css" />
    <link rel="stylesheet" type="text/css" href="http://alexgorbatchev.com/pub/sh/current/styles/shThemeEmacs.css" />
    <?php } ?>
    
    <script type="text/javascript">
    	SyntaxHighlighter.all();
    </script><!-- End of Syntax Highlighter -->

至此我们就完成了语法高亮的条件加载,节约了页面载入时间。

分类
工具周边

『WordPress』SyntaxHighlighter:无需插件的语法高亮解决方案

qq21-syntaxhighlighter-graphicsview

引言

需要用到代码的博客常常需要解决语法高亮的问题。方案通常有两种,第一是插件,第二是自动生成HTML高亮代码的网站。这二者各有其优缺点:

1、插件
不具体介绍,搜索一下能找到很多。
优点:生成代码简洁无冗余,使用方便,变更样式容易。
缺点:许多插件通过short-code的方式实现高亮,如果移除插件则样式失效。
2、网站
比如知名的发芽网
优点:通过纯HTML标记实现,样式能持久保存。
缺点:生成代码复杂,更改样式麻烦。

以上两种是目前常用的语法高亮方式,这里都不赘述,为了规避上述方式的缺陷,本站决定另辟蹊径,采取引用第三方JS和CSS的方法解决代码高亮问题,即SyntaxHighlighter。

安装

基本步骤

为WordPress添加SyntaxHighlighter支持只需遵循一下步骤:

  1. 为页面新增对基础文件的引用:shCore.js和shCore.css。
  2. 添加合适的笔刷文件,每种语言对应一个笔刷文件。
  3. 引用shCore.css和shThemeDefault.css。
  4. 调用SyntaxHighlighter.all()函数,完成。

具体到WordPress上,只需在主题header.php文件中的<head />标签内加入以下代码:

<!-- Syntax Highlighter -->
<!-- Include required JS files -->
<script type="text/javascript" src="https://alexgorbatchev.com/pub/sh/current/scripts/shCore.js"></script>
<!--Include a brush for every language you want to highlight -->
<script type="text/javascript" src="https://alexgorbatchev.com/pub/sh/current/scripts/shBrushPhp.js"></script>
<script type="text/javascript" src="https://alexgorbatchev.com/pub/sh/current/scripts/shBrushSql.js"></script>
<!-- Include *at least* the core style and default theme -->
<link href="http://alexgorbatchev.com/pub/sh/current/styles/shCore.css" rel="stylesheet" type="text/css" />
<link href="http://alexgorbatchev.com/pub/sh/current/styles/shThemeEmacs.css" rel="stylesheet" type="text/css" />
<!-- Finally, to actually run the highlighter, you need to include this JS on your page -->
<script type="text/javascript">
SyntaxHighlighter.all()
</script>

没错,以上EMACS编辑器高亮效果即是用本文介绍的方案实现的,除此之外还有多种高亮主题可供选择。

<pre />标签方法

pre 元素可定义预格式化的文本。被包围在 pre 元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体。<pre /> 标签的一个常见应用就是用来表示计算机的源代码。

优势:简单易用;如果高亮方法出现问题,不会对已有样式造成大的影响;在RSS阅读器中显示为普通<pre />标签的效果。

问题:必须对尖括号使用转义字符。即,“<”用“&lt;”,“>”用“&gt;”替换。

SyntaxHighlighter会自动搜寻以适当class属性修饰的<pre />标签,然后调用相应的笔刷进行渲染,达到语法高亮的效果。class中唯一需要写入的参数是brush(详见配置),取值为笔刷短码

以高亮php代码为例,使用时只需为代码段添加

<pre class="brush: php"></pre>

标签就能实现高亮。

结语

除了<pre />方法之外,还有一种<script />方法,在此不做介绍。

本方法的优点包括:

  1. 代码简洁无冗余,只需添加几行对JS和CSS的引用即可。
  2. 样式持久保存,不依赖short-code解析。
  3. 变更样式容易,只需修改一行代码更换加载的CSS主题。
  4. 使用方便,无需每次手工粘贴代码到网站去生成HTML标记,只需给代码段增加pre标签。