你如何缩进你的HTML？

时间：2012-02-29 02:24:50

标签： php html indentation

鉴于我的应用程序生成的HTML。

function pagination(){
  echo "<ul>\n";

  for($i = 1; $i <= 10; $i++)
    echo "\t<li>...</li>\n";

  echo "</ul>\n";
}
?>
<div>
  <?php pagination(); ?>
</div>

如果我添加另一个容器DIV，则不会产生正确的缩进代码。

该函数是否有任何解决方案以某种方式知道要添加多少\ t或空格，或以某种方式自动缩进html？

10 个答案:

答案 0 :(得分：13)

惊人的问题。

到目前为止，9个答案和3个评论，看起来没有人费心阅读问题正文，但只是重复了一些由标题中的关键字触发的福音 - 这是在stackoverflow的祝福网站上回答问题的最佳方式。

然而问题不是简单/单层。
我不得不承认，这本身就很模糊。所以，我们必须把它挖出来。

  

1）你如何缩进你的HTML？

使用模板，伙计。使用模板。唯一的答案。

  

2）该函数是否有任何解决方案以某种方式知道要添加多少\ t或空格，或以某种方式自动缩进html？

当然没有。
PHP对HTML，缩进等都不了解 特别是当尚未准备好HTML时（！）

  

3）如果我添加另一个容器DIV，则不会产生正确的缩进代码。

问题的关键问题 提出问题的问题。

其中最难的一切。

答案是那种我完全不同意的答案，呵呵：
虽然标签的相对顺序很重要，但对于生成的大型HTML，可以将一些块移出行：

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
    <h1>Hello</h1>
    <div>
<!-- news list -->
<div>
  <ul>
    <li>1..</li>
    <li>2..</li>
    <li>3..</li>
    <li>4..</li>
  </ul>
</div>
<!-- /news list -->
    </div>
    <div>
<!-- pagination -->
<ul>
  <li>Red</li>
  <li>Green</li>
  <li>Blue</li>
  <li>Black</li>
</ul>
<!-- /pagination -->
    </div>
</body>
</html>

它会让你在有意义的块中有适当的缩进，但仍然保持主HTML的顺序 作为副作用，它会让你的线条保持在屏幕上：）

为了在子模板中保持良好的缩进，我强烈建议使用基于PHP的模板。为善良而不是丑陋的HEREDOC！ 以下是PHP模板遵循的一条规则：
始终将PHP块保留在左侧。这就是全部。
要在PHP嵌套块之间保持缩进，只需在<? ?>

中缩进它们

示例：

<ul>
<? foreach ($thelist as $color): ?>
  <li>
<?   if ($color == $current): ?>
    <b><?=$color?></b>
<?   else ?>
    <a href="?color=<?=$color?>"><?=$color?></a>
<?   endif ?>
  </li>
<? endforeach ?>
</ul>

这将生成正确的缩进HTML，同时保持模板中HTML和PHP的顺序，使开发人员在开发和调试时更加轻松。

不要听任何说“根本不需要缩进代码！”的人。他们只是业余爱好者，而不是真正的开发者。任何了解调试的人，谁很难调试他们的代码，都会告诉你正确的缩进是必不可少的。

答案 1 :(得分：3)

答案可能听起来很奇怪，但你不应该担心生成的代码缩进。缩进是为了便于阅读，应该只关注程序员，而不是生成的部分（适用于浏览器）。

答案 2 :(得分：1)

我同意所有评论说不要打扰，但如果您确实有这样做的情况，那么您可以通过HTML Tidy（或在您的情况PHP Tidy）管道您的HTML使用indent选项。

答案 3 :(得分：0)

如果你在ul面前添加 \ t ，那么你应该可以看到代码正好了

<?php
function pagination(){
  echo "\t<ul>\n";

  for($i = 1; $i <= 10; $i++)
    echo "\t\t<li>...</li>\n";

  echo "\t</ul>\n";
}
?>
<div>
<?php pagination(); ?>
</div>

答案 4 :(得分：0)

大多数编辑器都有某种格式化功能，可以用来修复缩进。例如，在Visual Studio中，您可以按Ctrl + K + D以很好地格式化您的html。

答案 5 :(得分：0)

如果它是一个更复杂的html结构，我通常会这样做。如果你问我，这会让你更容易理解，你也可以正常编写你的html，而不是担心逃避引号和类似的东西。

由于您在处理HTML时不在PHP块中，因此它会在您创建时缩进。

<?php
function pagination(){
echo "</ul>\n";
   for($i = 1; $i <= 10; $i++)
   {
?>
        <li>...</li>
<?php
   }

echo "</ul>\n";
}
?>
<div>
   <?php pagination(); ?>
</div>

答案 6 :(得分：0)

您可以使用heredoc语法

<?php
$str = <<<EOD
Example of string
spanning multiple lines
using heredoc syntax.
EOD;

/* More complex example, with variables. */
class foo
{
    var $foo;
    var $bar;

    function foo()
    {
        $this->foo = 'Foo';
        $this->bar = array('Bar1', 'Bar2', 'Bar3');
    }
}

$foo = new foo();
$name = 'MyName';

echo <<<EOT
My name is "$name". I am printing some $foo->foo.
    Now, I am printing some {$foo->bar[1]}.
    This should print a capital 'A': \x41
    Notice all of the indenting is preserved.
EOT;
?>

答案 7 :(得分：0)

答案是，使用模板。

如果您将逻辑与演示文稿正确分开，这个问题就会消失。您的模板将包含您想要或需要的所有缩进或缺少缩进。

修改

尽管如此，您可以非常简单地修改代码：

<?php
function pagination($depth=0) {
  $indent = str_pad("", $depth, "\t");
  echo $indent."<ul>\n";

  for($i = 1; $i <= 10; $i++)
    echo $indent."\t<li>...</li>\n";

  echo $indent."</ul>\n";
}
?>
<div>
  <?php pagination(1); ?>
</div>
<div>
  <div>
    <?php pagination(2); ?>
  </div>
</div>

或者，你可以传入你想要的缩进：

<?php
function pagination($indent="") {
  echo $indent."<ul>\n";

  for($i = 1; $i <= 10; $i++)
    echo $indent."\t<li>...</li>\n";

  echo $indent."</ul>\n";
}
?>
<div>
  <?php pagination("\t"); ?>
</div>
<div>
  <div>
    <?php pagination("\t\t"); ?>
  </div>
</div>

答案 8 :(得分：0)

我也是格式良好的代码的坚持者。很多人在这里说“firebug会为你缩进你的代码”。那么，什么时候通过javascript修改传递给浏览器的标记或注入DOM？然后firebug显示当前状态，而不是从服务器加载的状态。

我也喜欢我的html在我的脚本中可见和可读。我通常做这样的事情，分别跟踪PHP和HTML缩进（它不能将光标放在开始标记或{上，只是向下滚动页面，直到找到结束标记或{ {1}}方便地与你的游标位置对齐。

}

这样输出，

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
    <h1>Hello</h1>
    <div><?php
$thelist = array('Red', 'Green', 'Blue', 'Black');
echo '
        <ul>';
foreach ($thelist as $color) {
    echo '
            <li>' . $color . '</li>';
}
echo '
        </ul>';
?>

    </div>
</body>
</html>

注意看起来就像它应该的样子，就像在脚本中一样（这使我的调试变得简单）。我使用单引号和HTML，所以我不必逃避一万亿个引号（这使串联字符串更加手动，但它比所有反斜杠更少;这也妨碍了脚本中的可读性。）

再一次，这就是我的工作方式，可能不是处理格式化HTML的理想方式。我只是喜欢让我的HTML很好，即使它与PHP混合

答案 9 :(得分：0)

编辑：将代码分解成页面
此代码实际上仅适用于模板系统 哪个可以是基本的：

// file: index.tpl.html

<html>
    <head>
    </head>
    <body>
        <div>Some header code</div>
        <div>
            {mainContent}
        </div>
        <div>Some footer code</div>
    </body>
</html>

// file: functions.php
<?php
    function pagination()
    {
        $output = "<ul>\n";

        for($i = 1; $i <= 10; $i++)
            $output = "\t<li>...</li>\n";

        $output = "</ul>\n";

        return $output;
    }

    function indent_html($html, $tag, $new_html)
    {
        // magic indenting code: finds how many spaces are used on the line above it
        $spacePos = 0;
        $find  = strpos($html, '{'.$tag.'}' );
        while( $html[ $find-$spacePos-1] == ' ' ) $spacePos++;

        // Uses the indent from the line above to indent your new html
        return str_replace("\n", "\n".str_repeat(" ", $spacePos), $new_html);
    }
?>

// file: index.php
<?php
    $html = file_get_contents("index.tpl.html");

    // magic indenting code: finds how many spaces are used on the line above it
    $spacePos = 0;
    $find  = strpos($html, '{mainContent}' );
    while( $html[ $find-$spacePos-1] == ' ' ) $spacePos++;

    // your pagination() needs to return html not output it
    $mainContent = pagination();
    $mainContent = indent_html($html, $tag, $mainContent);

    // Uses the indent from the line above to indent your new html
    $mainContent = str_replace("\n", "\n".str_repeat(" ", $spacePos), $mainContent);

    // finally insert your html
    $html = str_replace("{mainContent}", $mainContent, $html);
?>

如果要使用制表符而不是空格，可能需要进行一些修改 我使用空格，因为它更像是跨浏览器/应用程序。

相关问题
最新问题