recomendado - ¿Cómo sangrar correctamente el código mixto PHP/HTML?
todas las etiquetas de php (6)
- Respuesta directa a su pregunta: si necesita leer el resultado HTML a menudo, puede ser una buena cosa producir un HTML bien sangrado. Pero el caso más común será que necesita leer su código fuente php, por lo que es más importante que la fuente sea fácil de leer.
- Alternativa a las dos opciones que mencionaste: Mira tj111''s respuesta de chaos'' o tj111''s .
- Mejor aún en mi opinión: no mezcle HTML y php; utilice un motor de plantillas en su lugar.
Al mezclar PHP y HTML, ¿cuál es el estilo de sangría adecuado para usar? ¿Doy sangría para que el HTML resultante tenga la sangría correcta, o para que la mezcla PHP / HTML se vea correctamente formateada (y, por lo tanto, sea más fácil de leer)?
Por ejemplo, supongamos que tengo un bucle foreach emite filas de tabla. ¿Cuál de abajo es correcto?
La mezcla de PHP / HTML parece correcta:
<table>
<?php foreach ($rows as $row): ?>
<tr>
<?php if ($row->foo()): ?>
<?php echo $row ?>
<?php else: ?>
Something else
<?php endif ?>
</tr>
<?php endforeach ?>
</table>
El HTML entregado se ve correcto:
<table>
<?php foreach ($rows as $row): ?>
<tr>
<?php if ($row->foo()): ?>
<?php echo $row ?>
<?php else: ?>
Something else
<?php endif ?>
</tr>
<?php endforeach ?>
</table>
Descubrí que cuando me encuentro con esta situación (con bastante frecuencia), no tengo un estilo estándar para usar. Sé que puede no haber una respuesta "correcta", pero me encantaría escuchar las opiniones de otros desarrolladores.
A menudo ponderaba esta pregunta también, pero luego me di cuenta, ¿a quién le importa cómo se ve la salida de HTML? Sus usuarios no deberían mirar su HTML de todos modos. Es para que lo leas, y tal vez un par de otros desarrolladores. Mantenga el código fuente lo más limpio posible y olvídese de cómo se ve la salida.
Si necesita depurar la salida, use Herramientas de desarrollo de Chrome, Firebug o incluso Herramientas de F12.
El PHP y el HTML deben estar sangrados para que sean correctos con respecto a ellos mismos en forma de fuente, independientemente del otro y de la forma impresa:
<table>
<?php foreach ($rows as $row): ?>
<tr>
<?php if ($row->foo()): ?>
<?php echo $row ?>
<?php else: ?>
Something else
<?php endif ?>
</tr>
<?php endforeach ?>
</table>
Generalmente pongo etiquetas de apertura de PHP al comienzo de la línea, pero doy lo que está dentro de las etiquetas para que coincida con el formato html. No hago esto, sin embargo, para declaraciones de eco simples ya que uso etiquetas abre-cortas. Creo que lo hace más simple cuando navega por el archivo para encontrar todas las declaraciones.
<table>
<? foreach ($foo as $bar): ?>
<tr>
<? foreach ($bar as $baz): ?>
<td><?=$baz?></td>
<? endforeach ?>
</tr>
<? endforeach ?>
</table>
No debe preocuparse por la sangría de marcado en el entorno de producción. Tampoco deberías usar Tidy u otros purificadores de HTML. Hay casos de uso válidos, por ejemplo, cuando permite la entrada de HTML (pero considere usar Markdown lugar), aunque estos son raros.
La mayoría de las veces, los filtros y los embellecedores de HTML se utilizan para ocultar los problemas subyacentes con el código. No lo hagas Corrija su marcado manualmente.
Si necesita aplicar sangría a su código solo en el entorno de desarrollo, puede usar cualquiera de los anteriores. Sin embargo, tenga en cuenta que estas bibliotecas intentarán corregir su marcado (ese es su objetivo principal, la sangría es un subproducto). Dindent herramienta de sangría basada en expresiones regulares Dindent .
Dindent convertirá el marcado de esta manera:
<!DOCTYPE html>
<html>
<head></head>
<body>
<script>
console.log(''te> <st'');
function () {
test; <!-- <a> -->
}
</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>
A esto:
<!DOCTYPE html>
<html>
<head></head>
<body>
<script>
console.log(''te> <st'');
function () {
test; <!-- <a> -->
}
</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>
Dindent no intentará desinfectar ni interferir con su código más allá de añadir sangrías. Esto es para facilitar su desarrollo / depuración. No para producción
Siempre puede usar un poco de espacio en blanco para ayudar a la legibilidad. Basándose en la sangría del caos:
<table>
<?php foreach ($rows as $row): ?>
<tr>
<?php if ($row->foo()): ?>
<?php echo $row ?>
<?php else: ?>
Something else
<?php endif ?>
</tr>
<?php endforeach ?>
</table
El único inconveniente de esto es que si tiene muchos códigos combinados, puede hacer que su documento sea el doble de largo, lo que aumenta el desplazamiento. Aunque si tiene este código tan variado, es posible que desee considerar un motor de plantillas.