EmEditor Snippet

EmEditor代码片段介绍
yuguo

编辑器的重要性
编辑器对提高我们的工作效率有很大帮助
每个人都有自己用得最顺手的编辑器
我最喜欢也一直在用的编辑器是小巧快速的EmEditor，它最大的特点是快
今天希望通过一个实例，给大家分享代码片段插件的用法

利用代码片段编码
怎么做到的？

EmEditor中有一个插件叫“代码片段”，可以自定义习惯的代码片段。
对我们来说<a href=“#”></a>是灰常灰常常用的代码片段，所以我自定义了这个代码片段。

<a href="#">$0</a>
$0是一个变量，表示最后一个占位符
其它占位符包括$1,$2,$3……$n
代码片段触发后，光标会在各个占位符中依次激活。对于上述代码片段来说，只有一个占位符，所以会在之后跳转到$0所在的位置。

<imgsrc="$1" alt="$2"/>$0
这样的话，每次按下tab，光标会按照$1,$2,$0的顺序跳转，因为$0是终结，所以一定要放在最后一个，$0之后不会继续跳转

<imgsrc="$1" alt="${2:图片替代文字}"/>$0
这里给$2加上了一个默认值“图片替代文字”，也就是说：
1.代码片段的时候会在$2处输出默认值
2.光标跳到占位符$2的时候会选择默认值
这跟<imgsrc=“$1” alt=“$2图片替代文字”/>$0是不同的

$0

你一定注意到了，这个代码片段中有两个相同的占位符$1
两个相同的占位符是被同时编辑的！
代码片段的占位符很强大是不是？
还有更强大的！

$0

这就是我实际中在用的HTML注释代码片段，在刚才的基础上加了一点点东西：${SelText}，这是一个变量，代表输出代码片段被触发的时候选中的文本。

刚才我们所有的代码片段都是在HTML文件夹中创建，默认的作用范围是HTML，也就是说只有在编辑HTML的时候会触发代码片段。

由于CSS中也有注释块的需求，并且语法和HTML不同，所以我们要在CSS文件夹中再创建一个注释块。
我认为在CSS中创建注释块跟HTML中创建注释块是同一个功能的“重载”，所以使用了相同的名称和触发条件：se

看看我们现在都用代码片段干了些啥？
两次按键输出一个a链接
四次按键输出一个img图片（如果你的需求中有大量的图片，你可以把按键次数缩减到两次，比如设置触发代码为i）
三次按键输出一个块状注释（HTML和CSS都有效）
你也可以编辑自己的代码片段！可能你暂时无法记住这些复杂（其实非常简单）的“变量”，那么说说我们非常常见的一句代码
display:inline-block;*display:inline;zoom:1;
由于IE6/7对于inline-block的不支持，我们每次都要输入这些代码。
我做了一个代码片段来完成任务，相信你也能做到：

等等！我需要为每个HTML元素都设置代码片段？
不需要哦~~大部分HTML标签都是成对出现的（非自闭和），可以通过一个快速的方式一劳永逸。

太难么？其实不难，琢磨半个小时就能完全弄清除这些变量是怎么工作的。
太简单？？好吧，这里是代码片段支持的所有变量：

代码片段是我坚持使用和推荐EmEditor的主要原因。
其他编辑器也提供了很多快速编码的方法，但EmEditor通过它优秀的细节和强大的自定义功能占据上风。

觉得代码片段的编辑窗占用编辑区域？可以在插件属性中设置在后台运行，这样启动EmEditor就启动了代码片段。

谢谢大家！

http://yuguo.us	854
http://blog.itkiss.com	44
http://www.kuqin.com	39
http://cache.baidu.com	2
http://wonder-tonic.com	1
http://translate.googleusercontent.com	1

EmEditor Snippet

by chandleryu on Aug 28, 2010

Accessibility

Tags

Upload Details

Usage Rights

6 Embeds 941

Statistics

EmEditor Snippet — Presentation Transcript