PPP's Blog

雑コード帳

EmmetとVSCodeのマルチカーソルを使って簡単に連番の増減ができる

Emmetの機能に、「数値の増減」があります。

Increment/Decrement Number
https://docs.emmet.io/actions/inc-dec-number/

これにVSCodeで使えるマルチカーソルを合わせると、連番を手入力しなくて済むようになります。

例:連番が欠けた状態

<ul>
    <li>連番1</li>
    <li>連番3</li>
    <li>連番4</li>
    <li>連番5</li>
</ul>

上の状態で、連番3,4,5の手前にカーソルを合わせます。

f:id:code-zen:20220126232701p:plain
マルチカーソルで連番の数値を減らしたい箇所を選択

次に、ctrlshiftpを同時に押してdecrementと入力してみましょう。

f:id:code-zen:20220126232756p:plain
デクリメント機能を選択しようとしているところ

候補のDecrement by 1を選択すると、カーソルを置いていた3,4,5がそれぞれ1ずつ減って2,3,4になります。連番を増やすときにはincrementと入力すると同じく増加用の候補が出ます。