HTML 是否有 #Region 代码

Question

在 VB 和 C# 中，有 #Region ... #endRegion 并使其可折叠。 HTML 中有类似的方法吗？

现在，我只是在 HTML 页面上的不同元素处添加了注释，但我希望有一个折叠点，而不是所有 ; 和

标签已折叠。

Answer 1

在 Visual Studio Code 中，可以通过使用正确的语法来完成此操作：

<!-- #region -->
...
Code
...
<!-- #endregion -->

确保 # 和 region 或 endregion 之间没有空格。

Answer 2

这确实取决于 IDE，今天刚刚注意到 Visual Studio 的免费 Web Essentials 2012 插件的最新版本添加了 HTML 区域支持。

http://visualstudiogallery.msdn.microsoft.com/07d54d12-7133-4e15-becb-6f451ea3bea6< /a>

http://vswebessentials.com/changelog

  <!--#region main  -->


  <!--#endregion -->

Answer 3

从 Visual Studio 2013 Update 4 开始，HTML 编辑器现在支持区域。您可以使用内置的代码片段：输入“

<!-- #region SampleRegion -->
<!-- #endregion -->

您可以在此处的更新 4 中找到此改进和其他新功能的详细信息。

Answer 4

我认为简短的答案是否定的。

Region只是编辑器（Visual Studio）识别的IDE指令。 HTML 标准中没有任何内容，您在 HTML 中放入的任何内容也会直接发送到浏览器，因此我没有遇到任何内容，也无法想象会有任何内容。

Answer 5

突出显示要折叠的部分，然后转到 Edit ->概述->隐藏选择

参考：如何：在可视化 Web 中折叠和展开 HTML 元素开发人员

编辑：这假设您使用的是 Visual Studio

Answer 6

对于 Html：

<!--#region -->
        Code code code...
<!--#endregion -->

对于 Javascript：

// #region
        Code code code...
// #endregion

如您所见，Visual Studio 在注释内声明区域块。

Html 中的注释符号

// Javascript 中的注释符号

Answer 7

为了使大纲在 Visual Studio 2019 中工作，请确保评论结束标记前后都有空格：

<!-- #region -->
    <!--Blazor Components Signal-R server-->
    <script src="_framework/blazor.server.js"></script>
    <!-- jQuery -->
    <script src="~/lib/jquery/dist/jquery.min.js"></script>
    <!-- jQuery UI 1.11.4 -->
    <script src="~/lib/plugins/jquery-ui/jquery-ui.min.js"></script>
    <!--Bootstrap bundle-->
    <script src="~/lib/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<!-- #endregion -->

注意：这在 中不起作用Visual Studio 2022 尚未发布。

Answer 8

我使用 div 标签来折叠 html 代码块：

<div>
  Code Blocks...
</div>

在我学习

<!--#region explanation blocks  -->
        Code Blocks...
<!--#endregion -->

它们都解决问题之前。

Answer 9

您可以将其用于折叠注释，

<!-- Your comment caption -->
   <div class="hidden">
       Put Your comments here
   </div>

因此 div 可以在 VS 中的 html 代码中折叠或展开

Answer 10

<% # region %>

<% # endregion %>

Answer 11

奇怪的是，有时区域功能在 Visual Studio 2022 中对我有用，有时却不起作用。我尝试了上面的许多方法，对于该区域是否真正创建还是没有把握。

但我发现这每次都有效：

 <div data-region="My Header Region">This is my Header Region</div>
 </div>

它每次都会崩溃，并且清楚地显示区域名称。

**更新感谢@AndrewMorton 评论。