如何快速closuresVim中的HTML标签?
这已经有一段时间了,因为我不得不在Vim
做类似HTML的代码,但是最近我又遇到了这个问题。 假设我正在写一些简单的HTML
:
<html><head><title>This is a title</title></head></html>
我如何快速写下title,head和html的结束标签? 我觉得我在这里错过了一些非常简单的方法,并不涉及我逐一写下它们。
当然,我可以使用Ctrl P自动完成单个标签的名称,但是笔记本电脑键盘上的内容实际上是正确的取括号和斜线。
看一下这个..
closetag.vim
Functions and mappings to close open HTML/XML tags
http://vim.sourceforge.net/scripts/script.php?script_id=13
我使用类似的东西。
我发现使用xmledit插件相当有用。 它增加了两个function:
- 当您打开一个标签( 例如键入
<p>
)时,只要您将闭合>
键入到<p></p>
,就会展开标签,并将光标置于插入模式下的标签内。 -
如果你立即input另一个
>
( 例如你键入<p>>
),它将把它扩展为<p>
</p>
并在插入模式下将光标置于标记内,缩进一次。
xml vim插件将代码折叠和嵌套标签匹配添加到这些function中。
当然,如果你在Markdown中编写你的HTML内容并使用%!
你完全不必担心closures标签%!
通过您select的Markdown处理器来过滤您的Vim缓冲区:)
我喜欢最小的东西,
imap ,/ </<CX><CO>
我发现让vim为我写入开始和结束标记,而不仅仅是closures标记更为方便。 你可以使用Tim Pope出色的ragtag插件 。 用法如下所示(让|标记光标位置)键入:
跨度|
按CTRL + x 空格键
你得到了
<跨度> | </跨度>
您也可以使用CTRL + x ENTER而不是CTRL + x SPACE ,就可以得到
<跨度> | </跨度>
Ragtag可以做的不仅仅是它(例如,在这个%>或DOCTYPE周围插入<%= stuff)。 你可能想要查看其他插件作者ragtag ,尤其是环绕声 。
如果你做了任何细节, sparkup是非常好的。
来自他们网站的例子:
ul > li.item-$*3
扩展为:
<ul> <li class="item-1"></li> <li class="item-2"></li> <li class="item-3"></li> </ul>
与一个<Ce>
。
要做问题中给出的例子,
html > head > title{This is a title}
产量
<html> <head> <title>This is a title</title> </head> </html>
还有一个zencoding vim插件: https : //github.com/mattn/zencoding-vim
教程: https : //github.com/mattn/zencoding-vim/blob/master/TUTORIAL
更新:现在称为Emmet : http : //emmet.io/
摘自教程:
1. Expand Abbreviation Type abbreviation as 'div>p#foo$*3>a' and type '<cy>,'. --------------------- <div> <p id="foo1"> <a href=""></a> </p> <p id="foo2"> <a href=""></a> </p> <p id="foo3"> <a href=""></a> </p> </div> --------------------- 2. Wrap with Abbreviation Write as below. --------------------- test1 test2 test3 --------------------- Then do visual select(line wize) and type '<cy>,'. If you request 'Tag:', then type 'ul>li*'. --------------------- <ul> <li>test1</li> <li>test2</li> <li>test3</li> </ul> --------------------- ... 12. Make anchor from URL Move cursor to URL --------------------- http://www.google.com/ --------------------- Type '<cy>a' --------------------- <a href="http://www.google.com/">Google</a> ---------------------
制图
我喜欢立即closures我的块标记(而不是内联),并尽可能使用简单的快捷方式(尽可能避免像CTRL这样的特殊键,尽pipe我使用closetag.vim
来closures我的内联标记。)喜欢在启动代码块时使用这个快捷方式(感谢@ kimilhee;这是他的回答):
inoremap ><Tab> ><Esc>F<lyt>o</<Cr>"><Esc>O<Space>
示例用法
types-
<p>[Tab]
结果-
<p> | </p>
在哪里|
指示光标位置。
说明
-
inoremap
意味着在插入模式下创build映射 -
><Tab>
表示一个closures尖括号和一个制表符; 这是匹配的 -
><Esc>
表示结束第一个标签并从插入转换到正常模式 -
F<
表示find最后一个打开的angular度支架 -
l
表示将光标右移一个(不要复制开angular尖括号) -
yt>
表示从光标位置向上拉到下一个closuresangular括号之前(即复制标签内容) -
o</
表示在插入模式下开始换行并添加一个开angular尖括号和斜线 -
<Cr>"
表示从默认寄存器("
)插入模式下粘贴 -
><Esc>
表示closures结束标记并退出插入模式 -
O<Space>
表示在光标上方的插入模式下插入新行并插入空格
allml(现在是Ragtag)和Omni-completion(<CX> <CO>)在.py或.java文件中不起作用。
如果你想在这些文件中自动closures标签,你可以像这样映射。
imap <Cj> <ESC> F <lyt> $ a </ ^ R“>
(^ R是Contrl + R:你可以像这样Control + v然后Control + r)
(|是光标位置)现在,如果你键入..
<P> ABCDE |
并键入^ j
那么它就像这样closures标签
<P> ABCDE </ P> |
这是另一个简单的解决scheme,基于易于find的Web写作:
-
自动closuresHTML标记
:iabbrev </ </<CX><CO>
-
打开完成
autocmd FileType xml set omnifunc=xmlcomplete#CompleteTags
build立在@KeithPinson的优秀答案(抱歉,没有足够的声望点评论你的答案),这个替代scheme将阻止自动完成复制任何额外的东西,可能是在HTML标签(例如类,ID等。 ),但不应复制到结束标记。
更新我已更新我的响应与filename.html.erb
文件的工作。
我注意到我的原始响应在Rails视图中通常使用的文件中不起作用,比如some_file.html.erb
当我使用embedded式ruby(比如<p>Year: <%= @year %><p>
)。 下面的代码将与.html.erb
文件一起使用。
inoremap ><Tab> ><Esc>?<[az]<CR>lyiwo</<Cr>"><Esc>O
示例用法
types:
<div class="foo">[Tab]
结果:
<div class="foo"> | <div>
在哪里|
指示光标位置
作为添加结束标记而不是块样式的示例:
inoremap ><Tab> ><Esc>?<[az]<CR>lyiwh/[^%]><CR>la</<Cr>"><Esc>F<i
示例用法
types:
<div class="foo">[Tab]
结果:
<div class="foo">|<div>
在哪里|
指示光标位置
确实,上面的两个例子都依赖于>[Tab]
来标记一个结束标记(意味着你必须selectembedded或者块样式)。 就个人而言,我使用>[Tab]
的块样式和>>
的内联样式。
看看vim-closetag
这是一个非常简单的脚本(也可作为vundle
插件),为您closures(X)HTML标签。 从它的README
:
如果这是目前的内容:
<table|
现在你按> ,内容将是:
<table>|</table>
现在,如果再次按> ,内容将是:
<table> | </table>
注意: |
这里是光标