HTML Self-Closing Tags

HTML에서 "self-closing" 태그는 종료 태그가 필요 없는 태그를 의미합니다. 이러한 태그들은 일반적으로 내용을 포함하지 않으며, 단일 태그로 사용됩니다. HTML5에서는 이러한 태그들을 "void elements"라고 부릅니다.

 

이러한 태그들은 시작 태그만 있고, 별도의 종료 태그가 없으며 일반적으로 내용을 포함하지 않습니다. 예를 들어, 이미지나 줄바꿈을 나타내는 태그는 내용이 필요 없습니다. HTML 파서는 이러한 태그를 만나면 자동으로 태그가 종료된 것으로 처리합니다.

 

HTML5에서의 Self-Closing 태그 예시

<p>이것은 예시 문장입니다.<br>새로운 줄입니다.</p>
<img src="image.jpg" alt="예시 이미지">
<input type="text" name="name">
<meta charset="UTF-8">

 

HTML5에서는 self-closing 태그에 /를 추가하는 것이 필수는 아닙니다 (예: <br/> 대신 <br> 사용 가능). 그러나 JSX, XHTML과 같은 다른 마크업 언어에서는 이를 요구할 수 있습니다. 일부 태그는 전통적으로 self-closing이지만, HTML5에서는 이를 엄격하게 요구하지 않습니다. 예를 들어, <br>은 <br/>로 작성해도 되지만, 필수는 아닙니다.

 

그렇다면 script 태그는?

<script src="index.js" />

이건 동작하는 태그일까?   <script>  태그의 경우 자체 닫히는 스크립트 요소를 사용한 경우, HTML에서는 <script> 태그의 내용이 브라우저에 의해 닫는 태그를 만날 때까지 텍스트로 처리됩니다.  태그가 자체 닫힘이면, 브라우저는 스크립트가 어디서 끝나는지 알 수 없으며 실행하지 않습니다.

따라서 자체 닫히는 <script> 태그를 사용하면, 스크립트가 어떤 파일에서도 작동하지 않습니다. 이 문제를 해결하려면, 스크립트를 웹 페이지에 포함할 때 표준 <script> 태그와 닫는 태그를 사용해야 합니다. HTML 사양에서도 <script> 태그의 시작과 끝 태그가 필수라고 명수되어 있는 걸 확인 할 수 있습니다.

 

 

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script

<script>: The Script element - HTML: HyperText Markup Language | MDN

https://www.geeksforgeeks.org/why-dont-self-closing-script-elements-work/

Why don't self-closing script elements work ? - GeeksforGeeks