PHP/HTML 혼합 코드를 올바르게 들여쓰는 방법은 무엇입니까?
PHP와 HTML을 혼합할 때 사용할 적절한 들여쓰기 스타일은 무엇입니까?출력된 HTML이 올바른 들여쓰기가 되도록 들여쓰기를 해야 합니까, 아니면 PHP/HTML 혼합물이 올바르게 포맷된 것처럼 보이도록 해야 합니까(따라서 읽기가 더 쉽습니까)?
예를 들어, 제가 가지고 있다고 가정해 보세요.foreach
루프 출력 테이블 행.다음 중 어느 것이 맞습니까?
PHP/HTML 혼합은 올바른 것 같습니다.
<table>
<?php foreach ($rows as $row): ?>
<tr>
<?php if ($row->foo()): ?>
<?php echo $row ?>
<?php else: ?>
Something else
<?php endif ?>
</tr>
<?php endforeach ?>
</table>
출력된 HTML이 올바르게 표시됩니다.
<table>
<?php foreach ($rows as $row): ?>
<tr>
<?php if ($row->foo()): ?>
<?php echo $row ?>
<?php else: ?>
Something else
<?php endif ?>
</tr>
<?php endforeach ?>
</table>
저는 이런 상황에 처했을 때(자주), 사용할 표준 스타일이 없다는 것을 알게 되었습니다."정답"이 없을 수도 있다는 것을 알지만, 다른 개발자들의 의견을 듣고 싶습니다.
PHP와 HTML은 서로 상관없이 소스 형태와 출력 형태에 대해 정확하도록 각각 들여쓰기되어야 합니다.
<table>
<?php foreach ($rows as $row): ?>
<tr>
<?php if ($row->foo()): ?>
<?php echo $row ?>
<?php else: ?>
Something else
<?php endif ?>
</tr>
<?php endforeach ?>
</table>
저도 종종 이 질문에 대해 곰곰이 생각했지만, HTML 출력이 어떻게 보이는지 누가 신경 쓰나요?어쨌든 사용자가 HTML을 보면 안 됩니다.이것은 여러분이 읽을 수 있도록, 그리고 아마도 다른 개발자 몇 명을 위한 것입니다.소스 코드를 가능한 한 깨끗하게 유지하고 출력이 어떻게 보이는지는 잊어버립니다.
출력을 디버깅해야 하는 경우 Chrome Developer Tools, Firebug 또는 F12 Tools를 사용합니다.
저는 보통 줄의 시작 부분에 php 태그를 붙이는데, html 형식과 일치하도록 태그 안에 있는 것은 무엇이든 들여씁니다.하지만 저는 쇼트 오픈 태그를 사용하기 때문에 단순한 에코 문에 대해서는 이 작업을 하지 않습니다.모든 선언문을 찾기 위해 파일을 뒤적거릴 때 더 쉽게 찾을 수 있다고 생각합니다.
<table>
<? foreach ($foo as $bar): ?>
<tr>
<? foreach ($bar as $baz): ?>
<td><?=$baz?></td>
<? endforeach ?>
</tr>
<? endforeach ?>
</table>
- 질문에 대한 직접 답변:HTML 출력을 자주 읽어야 한다면, 들여쓰기가 잘 된 HTML을 출력하는 것이 좋을 수도 있습니다. 하지만 더 일반적인 경우는 당신의 php 소스 코드를 읽어야 하기 때문에 소스를 쉽게 읽을 수 있는 것이 더 중요합니다.
- 언급한 두 가지 옵션에 대한 대안:caos' 또는 tj111의 답변을 참조하십시오.
- 내 생각에는 여전히 더 나은 것 같습니다.HTML과 php를 섞지 말고 템플릿 엔진을 사용하세요.
읽기 쉽도록 항상 약간의 공백도 사용할 수 있습니다.혼돈의 들여쓰기를 기반으로 구축:
<table>
<?php foreach ($rows as $row): ?>
<tr>
<?php if ($row->foo()): ?>
<?php echo $row ?>
<?php else: ?>
Something else
<?php endif ?>
</tr>
<?php endforeach ?>
</table
이것의 유일한 단점은 혼합된 코드가 많은 경우 문서가 두 배로 길어질 수 있으므로 더 많은 스크롤이 가능하다는 것입니다.이렇게 많은 코드가 혼합되어 있는 경우 템플릿 엔진을 고려해 볼 수도 있습니다.
프로덕션 환경에서 마크업 들여쓰기에 대해 걱정하지 마십시오.Tidy나 다른 HTML 정화기를 사용해서는 안 됩니다.예를 들어 HTML 입력을 허용하는 경우(대신 Markdown을 사용하는 경우)와 같은 유용한 사용 사례가 있습니다.
대부분의 HTML 미화자 필터는 코드의 기본 문제를 숨기기 위해 사용됩니다.하지 마.마크업을 수동으로 수정합니다.
개발 환경에서만 코드를 들여쓰기해야 하는 경우 위의 두 가지 중 하나를 사용할 수 있습니다.그러나 이러한 라이브러리는 마크업을 수정하려고 시도합니다(이것이 주요 목적이며 들여쓰기는 부산물입니다).정규 표현 기반 들여쓰기 도구 Dindent를 작성했습니다.
Dindent는 다음과 같이 마크업을 변환합니다.
<!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>
대상:
<!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>
들여쓰기를 추가하는 것 이상으로 들여쓰기를 삭제하거나 코드를 방해하지 않습니다.이것은 개발/디버깅을 더 쉽게 하기 위한 것입니다.생산용이 아닙니다.
언급URL : https://stackoverflow.com/questions/1155799/how-to-properly-indent-php-html-mixed-code
'programing' 카테고리의 다른 글
Junit에서 @AutoWired 주석과 함께 @InjectMocks를 사용하는 방법 (0) | 2023.09.02 |
---|---|
.NetCore MariaDb Dapper - 저장 프로시저를 실행하는 방법? (0) | 2023.09.02 |
Gitrebase 병합 충돌 (0) | 2023.08.28 |
이름 속성에 대괄호가 있는 입력에 대한 jQuery 선택기 (0) | 2023.08.28 |
segue를 통해 데이터 전달 (0) | 2023.08.28 |