blocks|key|3313639|text|PHP和HTML都应该缩进，以便它们在源表单中相对于自身是正确的，而与彼此和输出的表单无关：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3313640|<table>
<?php+foreach+($rows+as+$row):+?>
++++<tr>
++++<?php+if+($row->foo()):+?>
++++++++<?php+echo+$row+?>
++++<?php+else:+?>
++++++++Something+else
++++<?php+endif+?>
++++</tr>
<?php+endforeach+?>
</table>|code-block|syntax|javascript|3313641|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>The PHP and the HTML should each be indented so that they are correct with respect to themselves in source form, irrespective of each other and of outputted form:</p>

<pre><code>&lt;table&gt;
&lt;?php foreach ($rows as $row): ?&gt;
    &lt;tr&gt;
    &lt;?php if ($row-&gt;foo()): ?&gt;
        &lt;?php echo $row ?&gt;
    &lt;?php else: ?&gt;
        Something else
    &lt;?php endif ?&gt;
    &lt;/tr&gt;
&lt;?php endforeach ?&gt;
&lt;/table&gt;
</code></pre>


blocks|key|335474|text|我通常将php开始标记放在行的开头，但缩进标记中的任何内容以匹配html格式。但是，我不会对简单的echo语句执行此操作，因为我使用的是短开标记。我认为当浏览文件以查找所有声明时，这会使它变得更简单。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|335475|++++<table>
<?++foreach+($foo+as+$bar):+?>
++++++<tr>
<?++++foreach+($bar+as+$baz):+?>

+++++++++<td><?=$baz?></td>

<?++++endforeach+?>
++++++</tr>
<?++endforeach+?>
++++</table>|code-block|syntax|javascript|335476|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>I generally put <em>opening</em> php tags at the beginning of the line, but indent whatever is inside the tags to match the html formatting.  I don't do this, however, for simple echo statements since I use short-open tags.  I think it makes simpler it when browsing through the file to find all the declarations.</p>

<pre><code>    &lt;table&gt;
&lt;?  foreach ($foo as $bar): ?&gt;
      &lt;tr&gt;
&lt;?    foreach ($bar as $baz): ?&gt;

         &lt;td&gt;&lt;?=$baz?&gt;&lt;/td&gt;

&lt;?    endforeach ?&gt;
      &lt;/tr&gt;
&lt;?  endforeach ?&gt;
    &lt;/table&gt;
</code></pre>


blocks|key|3100880|text|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3100881|直接回答您的问题:如果您需要经常阅读HTML输出，那么输出缩进良好的HTML可能是一件好事。但更常见的情况是，你需要阅读你的php源代码，所以更重要的是，你提到的两个选项的答案都是容易的:参见chaos'或tj111's+readable.|ordered-list-item|offset|length|3100882|Alternative。在我看来，|3100883|更好:不要混用HTML和php，而是使用模板引擎。|3100884|3100885|entityMap|0|LINK|mutability|MUTABLE|url|https://stackoverflow.com/questions/1155799/how-to-properly-indent-php-html-mixed-code/1155811#1155811|1|https://stackoverflow.com/questions/1155799/how-to-properly-indent-php-html-mixed-code/1155831#1155831^0|0|2O|6|0|2V|7|1|0|0|0|0^^$0|@$1|2|3|-4|4|5|6|U|7|@]|8|@]|9|$]]|$1|A|3|B|4|C|6|V|7|@]|8|@$D|W|E|X|1|Y]|$D|Z|E|10|1|11]]|9|$]]|$1|F|3|G|4|C|6|12|7|@]|8|@]|9|$]]|$1|H|3|I|4|C|6|13|7|@]|8|@]|9|$]]|$1|J|3|-4|4|5|6|14|7|@]|8|@]|9|$]]|$1|K|3|-4|4|5|6|15|7|@]|8|@]|9|$]]]|L|$M|$4|N|O|P|9|$Q|R]]|S|$4|N|O|P|9|$Q|T]]]]

<ol>
<li>Direct answer to your question: If you need to read the HTML output often, it might be a good thing to output well indented HTML. But the more common case will be that you need to read your php source code, so it is more important that the source is easily readable.</li>
<li>Alternative to the two options you mentioned: See <a href="https://stackoverflow.com/questions/1155799/how-to-properly-indent-php-html-mixed-code/1155811#1155811">chaos'</a>  or <a href="https://stackoverflow.com/questions/1155799/how-to-properly-indent-php-html-mixed-code/1155831#1155831">tj111's</a> answer.</li>
<li>Better still in my opinion: Don't mix HTML and php, use a template engine instead.</li>
</ol>


blocks|key|3100912|text|你也可以使用一些空格来提高可读性。建立在chaos的缩进之上：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3100913|<table>

<?php+foreach+($rows+as+$row):+?>

++++<tr>

++++<?php+if+($row->foo()):+?>
++++++++<?php+echo+$row+?>
++++<?php+else:+?>

++++++++Something+else

++++<?php+endif+?>

++++</tr>

++++<?php+endforeach+?>

</table|code-block|syntax|javascript|3100914|唯一的缺点是，如果你有大量的混合代码，它会使你的文档变得两倍长，这使得更多的滚动。不过，如果您有这么多混合代码，您可能会考虑使用模板引擎。|3100915|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

<p>You can always use a bit of whitespace too to help readability.  Building on chaos' indentation:</p>

<pre><code>&lt;table&gt;

&lt;?php foreach ($rows as $row): ?&gt;

    &lt;tr&gt;

    &lt;?php if ($row-&gt;foo()): ?&gt;
        &lt;?php echo $row ?&gt;
    &lt;?php else: ?&gt;

        Something else

    &lt;?php endif ?&gt;

    &lt;/tr&gt;

    &lt;?php endforeach ?&gt;

&lt;/table
</code></pre>

<p>The only downside with this is if you have <em>a lot</em> of mixed code it can make your document twice as long, which makes for more scrolling.  Although if you have this much mixed code you may want to consider a templating engine.</p>


blocks|key|3313755|text|我也经常思考这个问题，但后来我意识到，谁会关心HTML输出是什么样子呢？你的用户无论如何都不应该看你的HTML。它供您阅读，也可供其他开发人员阅读。尽可能保持源代码的整洁，忘记输出是什么样子的。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3313756|如果你需要调试输出，可以使用Chrome+Developer+Tools，Firebug，甚至F12工具。|3313757|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|F|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|G|8|@]|9|@]|A|$]]|$1|D|3|-4|5|6|7|H|8|@]|9|@]|A|$]]]|E|$]]

<p>I often pondered this question too, but then I realized, who cares what the HTML output looks like? Your users shouldn't be looking at your HTML anyway. It's for <em>YOU</em> to read, and maybe a couple other developers. Keep the <em>source</em> code as clean as possible and forget about what the output looks like.</p>

<p>If you need to debug the output, use Chrome Developer Tools, Firebug, or even F12 Tools.</p>


blocks|key|338984|text|您不应该为生产环境中的标记缩进而烦恼。您也不应该使用Tidy或其他HTML净化器。有一些有效的用例，例如，当你允许超文本标记语言输入(但考虑使用Markdown+)，尽管这种情况很少见。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|338985|最常见的HTML美化-过滤器被滥用来隐藏代码的潜在问题。不要。手动更正您的标记。|338986|如果您只需要在开发环境中缩进您的代码，则可以使用上面的任一种方法。但是，要注意这些库将试图修复您的标记(这是它们的主要目的；缩进是一个副产品)。我已经编写了基于正则表达式的缩进工具Dindent。|338987|Dindent将像这样转换标记：|338988|<!DOCTYPE+html>
<html>
<head></head>
<body>
++++<script>
++++console.log('te>+<st');
++++function+()+{
++++++++test;+
++++}
++++</script>
++++<div>
++++<script+src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
++++<div><table+border="1"+style="background-color:+red;"><tr><td>A+cell++++test!</td>
<td+colspan="2"+rowspan="2"><table+border="1"+style="background-color:+green;"><tr>+<td>Cell</td><td+colspan="2"+rowspan="2"></td></tr><tr>
++++++++<td><input><input><input></td></tr><tr><td>Cell</td><td>Cell</td><td>Ce
++++++++++++ll</td></tr></table></td></tr><tr><td>Test+<span>Ce+++++++ll</span></td></tr><tr><td>Cell</td><td>Cell</td><td>Cell</td></tr></table></div></div>
</body>
</html>|code-block|syntax|javascript|338989|要这样做：|338990|<!DOCTYPE+html>
<html>
++++<head></head>
++++<body>
++++++++<script>
++++console.log('te>+<st');
++++function+()+{
++++++++test;+
++++}
++++</script>
++++++++<div>
++++++++++++<script+src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
++++++++++++<div>
++++++++++++++++<table+border="1"+style="background-color:+red;">
++++++++++++++++++++<tr>
++++++++++++++++++++++++<td>A+cell+test!</td>
++++++++++++++++++++++++<td+colspan="2"+rowspan="2">
++++++++++++++++++++++++++++<table+border="1"+style="background-color:+green;">
++++++++++++++++++++++++++++++++<tr>
++++++++++++++++++++++++++++++++++++<td>Cell</td>
++++++++++++++++++++++++++++++++++++<td+colspan="2"+rowspan="2"></td>
++++++++++++++++++++++++++++++++</tr>
++++++++++++++++++++++++++++++++<tr>
++++++++++++++++++++++++++++++++++++<td>
++++++++++++++++++++++++++++++++++++++++<input>
++++++++++++++++++++++++++++++++++++++++<input>
++++++++++++++++++++++++++++++++++++++++<input>
++++++++++++++++++++++++++++++++++++</td>
++++++++++++++++++++++++++++++++</tr>
++++++++++++++++++++++++++++++++<tr>
++++++++++++++++++++++++++++++++++++<td>Cell</td>
++++++++++++++++++++++++++++++++++++<td>Cell</td>
++++++++++++++++++++++++++++++++++++<td>Ce+ll</td>
++++++++++++++++++++++++++++++++</tr>
++++++++++++++++++++++++++++</table>
++++++++++++++++++++++++</td>
++++++++++++++++++++</tr>
++++++++++++++++++++<tr>
++++++++++++++++++++++++<td>Test+<span>Ce+ll</span></td>
++++++++++++++++++++</tr>
++++++++++++++++++++<tr>
++++++++++++++++++++++++<td>Cell</td>
++++++++++++++++++++++++<td>Cell</td>
++++++++++++++++++++++++<td>Cell</td>
++++++++++++++++++++</tr>
++++++++++++++++</table>
++++++++++++</div>
++++++++</div>
++++</body>
</html>|338991|除了添加缩进之外，Dindent不会试图清理或以其他方式干扰您的代码。这是为了使您的开发/调试更容易。不是为了生产。|338992|entityMap|0|LINK|mutability|MUTABLE|url|http://daringfireball.net/projects/markdown/syntax|1|https://github.com/gajus/dindent^0|20|8|0|0|0|2I|7|1|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|14|8|@]|9|@$A|15|B|16|1|17]]|C|$]]|$1|D|3|E|5|6|7|18|8|@]|9|@]|C|$]]|$1|F|3|G|5|6|7|19|8|@]|9|@$A|1A|B|1B|1|1C]]|C|$]]|$1|H|3|I|5|6|7|1D|8|@]|9|@]|C|$]]|$1|J|3|K|5|L|7|1E|8|@]|9|@]|C|$M|N]]|$1|O|3|P|5|6|7|1F|8|@]|9|@]|C|$]]|$1|Q|3|R|5|L|7|1G|8|@]|9|@]|C|$M|N]]|$1|S|3|T|5|6|7|1H|8|@]|9|@]|C|$]]|$1|U|3|-4|5|6|7|1I|8|@]|9|@]|C|$]]]|V|$W|$5|X|Y|Z|C|$10|11]]|12|$5|X|Y|Z|C|$10|13]]]]

<p>You should not be bothered about markup indentation in the production environment. Neither should you use Tidy or other HTML purifiers. There are valid use cases, e.g. when you allow HTML input (but consider using <a href="http://daringfireball.net/projects/markdown/syntax" rel="nofollow">Markdown</a> instead), though these are rare.</p>

<p>Most often HTML beautifiers-filters are abused to hide the underlying issues with the code. Don't. Correct your markup manually.</p>

<p>If you need to indent your code only in the development environment, you can use either of the above. However, beware that these libraries will attempt to fix your markup (that's their primary purpose; indentation is a by-product). I've written Regular Expression based indentation tool <a href="https://github.com/gajus/dindent" rel="nofollow">Dindent</a>.</p>

<p>Dindent will convert markup like this:</p>

<pre><code>&lt;!DOCTYPE html&gt;
&lt;html&gt;
&lt;head&gt;&lt;/head&gt;
&lt;body&gt;
    &lt;script&gt;
    console.log('te&gt; &lt;st');
    function () {
        test; &lt;!-- &lt;a&gt; --&gt;
    }
    &lt;/script&gt;
    &lt;div&gt;
    &lt;script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"&gt;&lt;/script&gt;
    &lt;div&gt;&lt;table border="1" style="background-color: red;"&gt;&lt;tr&gt;&lt;td&gt;A cell    test!&lt;/td&gt;
&lt;td colspan="2" rowspan="2"&gt;&lt;table border="1" style="background-color: green;"&gt;&lt;tr&gt; &lt;td&gt;Cell&lt;/td&gt;&lt;td colspan="2" rowspan="2"&gt;&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;
        &lt;td&gt;&lt;input&gt;&lt;input&gt;&lt;input&gt;&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;Cell&lt;/td&gt;&lt;td&gt;Cell&lt;/td&gt;&lt;td&gt;Ce
            ll&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;Test &lt;span&gt;Ce       ll&lt;/span&gt;&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;Cell&lt;/td&gt;&lt;td&gt;Cell&lt;/td&gt;&lt;td&gt;Cell&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;&lt;/div&gt;&lt;/div&gt;
&lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p>To this:</p>

<pre><code>&lt;!DOCTYPE html&gt;
&lt;html&gt;
    &lt;head&gt;&lt;/head&gt;
    &lt;body&gt;
        &lt;script&gt;
    console.log('te&gt; &lt;st');
    function () {
        test; &lt;!-- &lt;a&gt; --&gt;
    }
    &lt;/script&gt;
        &lt;div&gt;
            &lt;script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"&gt;&lt;/script&gt;
            &lt;div&gt;
                &lt;table border="1" style="background-color: red;"&gt;
                    &lt;tr&gt;
                        &lt;td&gt;A cell test!&lt;/td&gt;
                        &lt;td colspan="2" rowspan="2"&gt;
                            &lt;table border="1" style="background-color: green;"&gt;
                                &lt;tr&gt;
                                    &lt;td&gt;Cell&lt;/td&gt;
                                    &lt;td colspan="2" rowspan="2"&gt;&lt;/td&gt;
                                &lt;/tr&gt;
                                &lt;tr&gt;
                                    &lt;td&gt;
                                        &lt;input&gt;
                                        &lt;input&gt;
                                        &lt;input&gt;
                                    &lt;/td&gt;
                                &lt;/tr&gt;
                                &lt;tr&gt;
                                    &lt;td&gt;Cell&lt;/td&gt;
                                    &lt;td&gt;Cell&lt;/td&gt;
                                    &lt;td&gt;Ce ll&lt;/td&gt;
                                &lt;/tr&gt;
                            &lt;/table&gt;
                        &lt;/td&gt;
                    &lt;/tr&gt;
                    &lt;tr&gt;
                        &lt;td&gt;Test &lt;span&gt;Ce ll&lt;/span&gt;&lt;/td&gt;
                    &lt;/tr&gt;
                    &lt;tr&gt;
                        &lt;td&gt;Cell&lt;/td&gt;
                        &lt;td&gt;Cell&lt;/td&gt;
                        &lt;td&gt;Cell&lt;/td&gt;
                    &lt;/tr&gt;
                &lt;/table&gt;
            &lt;/div&gt;
        &lt;/div&gt;
    &lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p>Dindent will not attempt to sanitise or otherwise interfere with your code beyond adding indentation. This is to make your development/debugging easier. Not for production.</p>


<p>When mixing PHP and HTML, what is the proper indentation style to use? Do I indent so that the outputted HTML has correct indentation, or so that the PHP/HTML mix looks properly formatted (and is thus easier to read)?</p>

<p>For example, say I have a <code>foreach</code> loop outputting table rows. Which one below is correct?</p>

<p><strong>PHP/HTML mix looks correct:</strong></p>

<pre><code>&lt;table&gt;
  &lt;?php foreach ($rows as $row): ?&gt;
    &lt;tr&gt;
      &lt;?php if ($row-&gt;foo()): ?&gt;
        &lt;?php echo $row ?&gt;
      &lt;?php else: ?&gt;
        Something else
      &lt;?php endif ?&gt;
    &lt;/tr&gt;
  &lt;?php endforeach ?&gt;
&lt;/table&gt;
</code></pre>

<p><strong>Outputted HTML looks correct:</strong></p>

<pre><code>&lt;table&gt;
&lt;?php foreach ($rows as $row): ?&gt;
  &lt;tr&gt;
  &lt;?php if ($row-&gt;foo()): ?&gt;
    &lt;?php echo $row ?&gt;
  &lt;?php else: ?&gt;
    Something else
  &lt;?php endif ?&gt;
  &lt;/tr&gt;
&lt;?php endforeach ?&gt;
&lt;/table&gt;
</code></pre>

<p>I've found that when I run into this situation (quite frequently), I don't have a standard style to use. I know that there may not be a "correct" answer, but I'd love to hear thoughts from other developers.</p>


How to properly indent PHP/HTML mixed code?

在混合使用PHP和HTML时，应该使用哪种适当的缩进样式？缩进是使输出的HTML具有正确的缩进，还是使PHP/HTML混合看起来格式正确(因此更容易阅读)？例如，假设我有一个输出表格行的foreach循环。下面哪一个是正确的？HTML/的混合看起来是正确的：<table>  <?php foreach ($rows a...

问如何正确缩进PHP/HTML混合代码？
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何正确缩进PHP/HTML混合代码？EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何正确缩进PHP/HTML混合代码？
EN