Vimのテキストオブジェクトとsurround.vimでhtml編集の効率を上げる

2011年12月21日

Vim

私がVimでhtml編集を行うときに便利だと思った機能やプラグインを紹介します。全部で2回を予定しています。

初回はテキストオブジェクトとsurround.vimです。

目次

  1. テキストオブジェクト
  2. surround.vim

テキストオブジェクト

テキストオブジェクトとは

テキストオブジェクトとは、記号などで囲まれたテキストをオブジェクトとして扱うことができる、Vimの機能です。テキストオブジェクトを使うと、ある記号で囲まれたテキストをコピーしたり削除したりできます。

Vimを使い始めて間もないころ、それまで秀丸やIDEしか使ったことがなかった私はVimのテキストオブジェクトの便利さに感心したことを覚えています。これを覚えてから、テキストの編集効率は格段にあがりました。

使用例

テキストオブジェクトを理解するには、使用例を確認するのが手っ取り早いです。

下記は、ノーマルモードのとき*の後ろにカーソルがある状態で、Commandの操作を行ったときの例です。

Old text                  Command     New text
"Hello *world!"           di"         ""
'Hello *world!'           di'         ''
(123+4*56)/2              di(         ()/2
{12i+4i56}/2              di{         {}/2
<div>Yo!*</div>           dit         <div></div>
Hello wo*rld!             diw         Hello !

i"やi'がテキストオブジェクトです。

上記の例では削除しか行なっていませんが、オペレータ(d,y,cなど)を変更すればコピーや変更にも使用することができます。

私はhtmlを編集するとき、citでタグの内側のテキストを削除して編集したり、ci"でダブルクォーテーションの中のテキストを削除して編集することをよくやります。慣れると離れられません。

テキストオブジェクトは他にもいろんな種類があります。詳しくは:help text-objectsコマンドを実行してください。

surround.vim

surround.vimとは

surround.vimは、囲んでいる文字に対して操作をしたり、文字を何かで囲んだりすることができるプラグインです。こちらも使用例を確認するのが手nっ取り早いです。

ダウンロードとインストール

下記よりダウンロードします。

https://github.com/tpope/vim-surround

私はプラグイン管理に Pathogen を使用しているので、ダウンロードして解答したフォルダを下記の位置に配置します。

  • Windowsの場合は$HOME/vimfiles/bundle/
  • Mac,Linuxの場合は$HOME/.vim/bundle/

囲んでいる文字を削除する(delete surround)

下記は、ノーマルモードのとき*の後ろにカーソルがある状態で、Commandの操作を行ったときの例です。

Old text                  Command     New text
"Hello *world!"           ds"         Hello world!
(123+4*56)/2              ds)         123+456/2
<div>Yo!*</div>           dst         Yo!

囲み文字が削除されます。

フォーマット
ds{surround}

{surround}には削除したい囲み文字を入力します。

囲んでいる文字を変更する(change surround)

下記は、ノーマルモードのとき*の後ろにカーソルがある状態で、Commandの操作を行ったときの例です。

Old text                  Command     New text
"Hello *world!"           cs"'        'Hello world!'
"Hello *world!"           cs"<q>      <q>Hello world!</q>
(123+4*56)/2              cs)]        [123+456]/2
(123+4*56)/2              cs)[        [ 123+456 ]/2
<div>Yo!*</div>           cst<p>      <p>Yo!</p>

囲み文字が変更されます。

フォーマット
cs{target_surround}{replace_surround}

{target_surround}には変更対象の囲み文字を指定します。
{replace_surround}には変更する囲み文字を指定します。

テキストを囲む(良い略名が無いそうです)

下記は、ノーマルモードのとき*の後ろにカーソルがある状態で、Commandの操作を行ったときの例です。

Old text                  Command     New text ~
Hello w*orld!             ys$"        Hello w"orld)!"
Hello w*orld!             ysw'        Hello w'orld')!
Hello w*orld!             ysiw)       Hello (world)!
Hello w*orld!             yss"        "Hello world!"
Hello w*orld!             yssB        {Hello world!}

テキストが指定した文字で囲まれます。

フォーマット
ys{vim_motion or text_object}{surround}

{vim_motion or text_object}にはモーション(h,j,w,$,fのようなvimのカーソル移動操作)、もしくは、テキストオブジェクトを指定します。例外として、sは現在行を指定する操作となります。{surround}には囲みとして使用したい記号、htmlタグなどを指定します。

次は zencoding.vim を紹介します。

Vim
zencoding-vimでhtml編集の効率を上げる

私がVimでhtml編集を行うときに便利だと思った機能やプラグインを紹介します。 前回はテキストオブジェクトとsurro ...

続きを見る

-技術ブログ
-