如何使用Vim折叠/展开HTML标签

Question

是否有一些插件可以在Vim中折叠HTML标签？
或者还有另一种方法来设置折叠或展开html标签的快捷方式？
我想折叠/展开html标签,就像我用缩进折叠一样.

Answer 1

我发现zfat(或者同样zfit)适用于使用HTML文档进行折叠.za将切换(打开或关闭)现有折叠.zR打开当前文档中的所有折叠,zM有效地重新启用文档中标记的所有现有折叠.

如果你发现自己广泛使用折叠,你可以为自己做一些方便的键绑定 .vimrc.

Answer 2

如果您缩进HTML,则以下内容应该有效:

set foldmethod=indent

我发现,这个问题是有太多的折叠.为了解决这个问题,我分别使用zO和zc打开和关闭嵌套折叠.

有关help fold-indent更多信息,请参阅

The folds are automatically defined by the indent of the lines.

The foldlevel is computed from the indent of the line, divided by the
'shiftwidth' (rounded down).  A sequence of lines with the same or higher fold
level form a fold, with the lines with a higher level forming a nested fold.

The nesting of folds is limited with 'foldnestmax'.

Some lines are ignored and get the fold level of the line above or below it,
whichever is lower.  These are empty or white lines and lines starting
with a character in 'foldignore'.  White space is skipped before checking for
characters in 'foldignore'.  For C use "#" to ignore preprocessor lines.

When you want to ignore lines in another way, use the 'expr' method.  The
indent() function can be used in 'foldexpr' to get the indent of a line.

Answer 3

安装js-beautify命令（JavaScript版）

npm -g install js-beautify  
wget --no-check-certificate https://www.google.com.hk/ -O google.index.html  
js-beautify -f google.index.html  -o google.index.bt.html  

http://www.google.com.hk原始html:

js-beautify 和 vim 折叠：

Answer 4

使用foldmethod语法折叠html，这比较简单。

该答案基于vim中的HTML语法折叠。作者是@Ingo Karcat。

1. 使用以下命令将fold方法设置为语法：

   vim命令行 :set foldmethod=syntax

   或将设置放入 ~/.vim/after/ftplugin/html.vim

   setlocal foldmethod=syntax
   

2. 到目前为止，还请注意，默认语法脚本仅折叠多行标签本身，而不折叠开始和结束标签之间的文本。

       So, this gets folded:
   
           <div
               class="foo"
               id="bar"
           > 
   
       And this doesn't
   
           <div>
               <b>text between here</b>
           </div>
   

3. 要在标签之间折叠，您需要通过以下最佳位置扩展语法脚本： ~/.vim/after/syntax/html.vim

   语法折叠是在所有无效的html元素之间进行的（这些元素没有封闭的同级，例如<br>）

   syntax region htmlFold start="<\z(\<\(area\|base\|br\|col\|command\|embed\|hr\|img\|input\|keygen\|link\|meta\|para\|source\|track\|wbr\>\)\@![a-z-]\+\>\)\%(\_s*\_[^/]\?>\|\_s\_[^>]*\_[^>/]>\)" end="</\z1\_s*>" fold transparent keepend extend containedin=htmlHead,htmlH\d