6

这是一个困扰我一段时间的问题，现在缩进 HTML 代码被认为是一种很好的做法，但我对 MVC 模式中的代码缩进有一些保留，这是一个（愚蠢的）示例：

HTML 代码：

<!DOCTYPE html>
<html>
<head>
<title>Testing MVC Indentation</title>
</head>

<body>

<?php View('h1', 'I am a Level 1 Header'); ?>

    <table>
        <tr>
            <td>
                <?php View('h1', 'I am a Level 1 Header Inside a Table'); ?>
            </td>
        </tr>
    </table>

</body>
</html>

为了正确缩进，对h1视图（或部分）的第一次调用应该返回：

\t<h1>I am a Level 1 Header</h1>

虽然对h1视图的第二次调用应该返回：

\t\t\t\t<h1>I am a Level 1 Header Inside a Table</h1>

然而h1，视图不知道它所在的缩进范围，那么它怎么能返回正确缩进的数据呢？此外，忽略视图中的缩进可能会泄露部分应用程序逻辑（请查看此页面的 HTML 源代码以<div id="content">获取真实示例）：

<body>

<h1>I am a Level 1 Header</h1>

    <table>
        <tr>
            <td>
<h1>I am a Level 1 Header Inside a Table</h1>
            </td>
        </tr>
    </table>

</body>

根本不缩进解决了所有问题，但它也使它更难阅读和维护：

<body>

<h1>I am a Level 1 Header</h1>

<table>
<tr>
<td>
<h1>I am a Level 1 Header Inside a Table</h1>
</td>
</tr>
</table>

</body>

我看到这个问题的唯一可行解决方案是使用Tidy和output buffering，但我想知道是否值得付出努力，因为它会使处理和加载不必要的（？）缓慢。此外，这不会使 HTML 代码的维护变得更容易，因为它只缩进输出，而不是源代码。

对于“基本”问题，我很抱歉，但过去几年我一直专注于业务逻辑，并且我与演示世界有点脱节 - 在过去的美好时光中，我的 HTML 代码都是未缩进的，但后来再次，我也使用表格来设计布局 - 只是想现在赶上。

关于这个主题的任何解决方案/见解？

相关问题：

4

5 回答 5

5

我会说， HTML和源代码缩进之间是有区别的。在典型的 MVC 视图中，您使用我认为应该以可读方式缩进的源代码。

实际的 HTML 输出是另一回事。当然，混乱缩进的源代码看起来有点不专业（这就是为什么我有时倾向于只删除任何缩进，但这通常涉及你所说的一些 HTML 后处理），但对于浏览器本身来说，如果根本不重要，如果我真的需要查看源代码，我将使用格式化程序或 Firebug，它以格式良好的方式显示所有 DOM 元素。

于 2010-02-20T13:46:31.463 回答
4

如前所述，源代码缩进和输出缩进是有区别的。源代码的缩进可以不同于输出的缩进，因为输出是动态构造的。在编写模板时，源代码的可读性是最重要的。你应该首先关注它！通常输出的 HTML 缩进不是问题。

话虽如此，有两种实用的方法可以消除输出中的缩进不匹配：

使用可以正确缩进输出的模板语言

第一个例子是Haml，一种 Ruby 的模板语言。它需要一个这样的模板：

%body
  %h1 I am a Level 1 Header
  %table
    %tr
      %td
        %h1 I am a Level 1 Header Inside a Table

输出将是与您的示例类似的格式整齐的 HTML，所有缩进都正确。

这种方法的一个明显缺点是，您并没有真正在模板中编写 HTML，而是使用另一种具有类似 HTML 语义的语言编写。这可能是一个问题，具体取决于谁将维护视图。

从输出中去除所有多余的空格，根本不缩进

一些模板语言可以选择删除所有多余的空格。例如，Smarty for PHP 有一个空白修剪插件可以很好地完成这项工作。它通过故意使所有输出同样不缩进来完全解决输出美化问题。它还节省了非常少的带宽。

仅 PHP 的解决方案是ob_start()与它的$output_callback处理程序一起使用（在此处记录）。您可以编写一个简单的回调来去除过多的空格，类似于 Smarty 插件。与在输出回调中使用 Tidy 不同，这仍然允许您在页面结束之前刷新缓冲区以加速长/慢页面。

于 2010-02-20T15:08:27.990 回答
3

抱歉添加第三个答案！已经有一段时间了，我宁愿添加一个答案，请不要为此投反对票。我只是觉得应该在这里说：

这似乎可行，也就是有 2 个不同的缩进“线程”，一个用于 PHP，一个用于 HTML：

<table>
<?foreach($list->sections as $sKey => $section) { ?>
    <tr><td><h4><?= $section->label ?></h4></td></tr>
<?  foreach($section->items as $iKey =>  $item) { ?>
    <tr><td><?= $item->label ?></td></tr>
<?  } ?>
<?} ?>
</table>

通过始终让 php 标记从行首开始，并在 php 块代码内缩进，生成的代码保持干净：

<table>
    <tr><td><h4>Books 1</h4></td></tr>
    <tr><td>Some Book</td></tr>
    <tr><td>Some Other Book</td></tr>
    <tr><td><h4>Books 2</h4></td></tr>
    <tr><td>Some Book in List 2</td></tr>
</table>

PHP 和 HTML 的缩进逻辑保存在源文件中，尽管它们各自独立。

于 2011-04-20T15:20:13.690 回答
1

我有时会在双引号字符串中使用 \t 来实现 HTML 的一些基本缩进。它可以帮助我调试东西。此外，我尽可能将 HTML 保留在模板中，即使这意味着用 foreach 循环来混淆我的模板。在模板（MVC 中称为“视图”）中，PHP 代码缩进通常跟随在 HTML 代码之后。

我还可以为生成 HTML 的函数添加一个参数，以使它们“具有缩进意识”示例：

buildSomeHtmlList($data, $indent=0)

这导致大多数缩进的 HTML，这很适合我。

顺便说一句，在您的示例中，这不是应该发生的事情，AFAIk，表内的 H1 通常应该正确缩进，因为 PHP 输出从“<？”开始，此时选项卡已经打印。

于 2010-08-31T03:54:17.860 回答
1

我认为可以在这里发明一些东西来跟踪缩进。

我相信，有可能同时正确缩进 PHP 和正确缩进 HTML，但是需要编写代码来处理它，无论是作为 PHP 扩展还是作为库（这不太优雅和高效）。

我的第一个猜测是 PHP 会跟踪 HTML 的缩进，当打印新行时，恢复到上一个​​缩进级别，就像大多数 IDE 在您键入 enter 时所做的那样。PHP 程序员可以通过这些函数来控制它（我现在只是在做这些东西）：

  • tab($n) : 向右移动缩进级别 $n 制表符（添加 $n 制表符）
  • detab($n) ：从缩进级别删除 $n 制表符
  • stop() ：停止缩进。不会将选项卡添加到输出中。这对于 HTML PRE 标记很有用。
  • resume() ：在 stop() 之后恢复上一级的缩进。
于 2010-08-31T03:45:40.777 回答