How can I select an HTML tag's content in Vim?

Question

Is it possible to select an HTML tag's content in Vim?

For example:

<p>I am a silly butterfly</p>

I would like to select "I am a silly butterfly".

I know that you can use vi" to select text inside quotes, brackets, etc. The problem here is that the text inside the HTML tags is not really within anything that I can use the i function for.

score 84 · Accepted Answer · answered Aug 30 '10 at 02:18

84

You can use vit to visually select text in a tag. See

:help v_it

answered Aug 30 '10 at 02:18

garyjohn

34,610
8
97
89

2

Perfect! Gonna write a post about this in my blog, I couldn't find anything on Google with "Vim selecting html tag contents" and others. – fholgado Aug 30 '10 at 02:48
You can also substitute `v` with many other commands, I often use `c` to `c`hange; `>` and `<` to fix indentation. – davetapley Apr 19 '12 at 17:24
How do you select the tags as well? In this case the `
` tags.
– hobbes3 Apr 26 '13 at 18:35
9

@hobbes3: To include the tags in the selection, use `vat`. I think of `it` as *in* a tag and `at` as *a* tag. See `:help at`. – garyjohn Apr 26 '13 at 19:07
1

Am I the only one whose vim selects the opening tag with `vit`? It's been bothering me for years and have no idea why Vim does that. – Jonathan Dumaine May 03 '15 at 05:09
2

Note that you can also use both multiple times, eg. `vatat` – user1338062 Jul 25 '15 at 16:23

score 12 · Answer 2 · edited Jun 12 '20 at 13:48

12

Here are the steps:

Place the cursor on the tag.
Enter Visual mode by pressing v.
Select the inner tag block by pressing i+t (or a+t for outer tag block).

at a <tag> </tag> block (with tags)

it inner <tag> </tag> block

See more at "How to jump between matching HTML/XML tags?".

edited Jun 12 '20 at 13:48

Community

1

answered Feb 17 '15 at 14:03

kenorb

24,736
27
129
199

score 1 · Answer 3 · answered Sep 22 '19 at 14:55

1

If the format is well indent like this,

<div>
  <p>
    I am a silly butterfly
  </p>
  <p>
    I am a silly butterfly
  </p>
</div>

You use can vim-indent-object plugin, and type vii

answered Sep 22 '19 at 14:55

foxiris

111
2

How can I select an HTML tag's content in Vim?

3 Answers3

Linked