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>

我看到这个问题的唯一可行解决方案是使用Tidyoutput 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 回答