(회피하지 않는) 자기 닫기 태그는 HTML5에서 유효합니까?

programing

(회피하지 않는) 자기 닫기 태그는 HTML5에서 유효합니까?

cafebook 2023. 4. 8. 09:14

(회피하지 않는) 자기 닫기 태그는 HTML5에서 유효합니까?

W3C 검증기(Wikipedia)는 태그('로 끝나는 태그)를 스스로 닫는 것을 좋아하지 않습니다./>") 비고정 요소.(소수 요소는 콘텐츠를 포함하지 않을 수 있습니다.)HTML5에서도 유효합니까?

허용되는 보이드 요소의 몇 가지 예:

<br />
<img src="" />
<input type="text" name="username" />

거부된 비포이드 요소의 예는 다음과 같습니다.

<div id="myDiv" />
<span id="mySpan" />
<textarea id="someTextMessage" />

_{보이드 태그를 는 원래 W3C Validator) 때문에 .작성자는 원래 단순한 오타 때문에 문제가 있었습니다.\>/>단,하다고는 할 수 없습니다.또, 에서는 다양한 태그의 에 대해 하고 있습니다.}

(이론적으로) HTML 4에서는<foo / () 없음)>은 「( )」를 의미합니다.<foo>은 (로 ), > (예:) > 및 )의 개요<title/hello/<title>hello</title>이론적으로'라는 용어를 사용하는 이유는 브라우저가 지원을 제대로 하지 못한 SGML 규칙이기 때문입니다.서포트가 거의 없었기 때문에(이것이 emacs-w3m에서만 동작하는 것을 본 적이 있습니다), 스펙에서는 작성자에게 구문을 사용하지 말라고 조언하고 있습니다.
XHTML에서는 를 의미합니다.이것은 모든 XML 문서에 적용되는 XML 규칙입니다.즉, XHTML은 종종 다음과 같이 제공됩니다.text/html됩니다.application/xhtml+xmlW3C는 XHTML에 관한 호환성 가이드라인을 제공하고 있습니다.text/html ( (「」: 가 「EMPTY되어 있는 또, HTML되어 있는 경우)에는, 클로징 을 사용해 ).요소가 EMTIFY로 정의되어 있는 경우(또한 HTML 사양에서는 엔드 태그가 금지되어 있는 경우)에만 자기 닫기 태그 구문을 사용하십시오.
HTML5에서 의미는<foo /> 는 요소의 유형에 따라 달라집니다.
- void 요소로 지정된 HTML 요소(본질적으로 "HTML5 이전에 존재하여 콘텐츠를 갖지 못하도록 금지된 요소")에서 엔드 태그는 단순히 금지됩니다.시작 태그 끝에 있는 슬래시는 허용되지만 의미가 없습니다.XML에 중독된 사람(및 구문 강조 표시등)을 위한 구문 설탕일 뿐입니다.
- 다른 HTML 요소에서는 슬래시가 오류이지만 오류 복구로 인해 브라우저는 슬래시를 무시하고 태그를 일반 시작 태그로 취급합니다.이 경우 일반적으로 엔드 태그가 누락되어 후속 요소가 형제자매가 아닌 자식 요소가 됩니다.
- 외부 요소(SVG 등의 XML 애플리케이션에서 Import됨)는 이 요소를 자체 닫힘 구문으로 처리합니다.

셀프 클로징 div는 검증되지 않습니다.이는 div가 보이드 요소가 아닌 일반 요소이기 때문입니다.

HTML5 사양에 따르면 콘텐츠를 포함할 수 없는 태그(void 요소라고 함)는 셀프 클로징*이 가능합니다.여기에는 다음 태그가 포함됩니다.

area, base, br, col, embed, hr, img, input, 
link, meta, param, source, track, wbr

이므로, "/"는 "/"입니다.<img/> <img><img></img>효입니니다다

※주: 외부 요소도 스스로 닫힐 수 있지만, 이 답변의 범위는 아니라고 생각합니다.

실제로 HTML에서 자체 닫기 태그를 사용하는 것은 예상대로 작동합니다.다만, 유효한 HTML5 의 기입에 관심이 있는 경우는, 이러한 태그의 사용이, 사용할 수 있는 2 개의 다른 구문 형식내에서 어떻게 동작하는지를 이해해 둘 필요가 있습니다.HTML5는 HTML 구문과 XHTML 구문을 모두 정의합니다.이 구문들은 유사하지만 동일하지는 않습니다.어느 것이 사용되는지는, Web 서버가 송신하는 미디어 타입에 따라서 다릅니다.

대부분의 경우, 당신의 페이지는text/htmlHTML을 사용합니다.에서는 특정 를 에 / 를 할 수 .되므로 /는 무시됩니다.<hr> ★★★★★★★★★★★★★★★★★」<hr /> 를 " 요소요소 합니다.HTML 사양은 이러한 요소를 "void 요소"라고 부르며 유효한 요소 목록을 제공합니다.하게 말하면요소의 를 들어, "/" 보이드"는 "/" 보이드"입니다.예를 들어 다음과 같습니다.  ★★★★★★★★★★★★★★★★★」<hr />입니다만, 「HTML5렇지않않 않않않다다

HTML5 사양은 HTML 작성자와 웹 브라우저 개발자에게 올바른 것을 명확하게 구분하며, 두 번째 그룹은 모든 종류의 비활성 "레거시" 구문을 수용해야 합니다.는 "HTML5"와 부정한.그리고 아마 예상대로 렌더링합니다.그러나 작성자에게 이 페이지는 유효한 HTML5가 아닙니다.(더 중요한 것은 이런 종류의 불법 구문을 사용함으로써 얻을 수 있는 DOM 트리가 심각하게 망가질 수 있다는 것입니다; 자기 클로즈됨예를 들어 태그는 일을 많이 망치는 경향이 있습니다.)

(서버가 XHTML 파일을 XML MIME 타입으로 송신하는 방법을 알고 있는 경우는, 페이지가 XHTML DTD 및 XML 구문에 준거할 필요가 있습니다.즉, 그렇게 정의된 요소에는 자체 닫힘 태그가 필요합니다.)

HTML5는 기본적으로 후행 슬래시가 없는 것처럼 동작합니다.HTML5 구문에는 셀프 클로징 태그와 같은 것은 없습니다.

다음과 같은 비포이드의 요소에 대한 태그 자동 닫기,<div/>전혀 작동하지 않습니다.후행 슬래시는 무시되고 열린 태그로 처리됩니다.이로 인해 네스트 문제가 발생할 수 있습니다.

슬래시 됩니다. ★★★★★★★★★★★★★★★★★」<div />을 사용법
보이드 요소의 태그 자동 닫기:  ★★★★★★★★★★★★★★★★★」<img src="" alt=""/> 는 동작합니다만, 후행 슬래시가 무시되기 때문에, 이 경우는 올바른 동작이 됩니다.

그 결과 이전 "XHTML 1.0"에서 text/html로 동작한 것은 이전과 같이 계속 동작합니다.비포이드 태그의 trailing slash는 받아들여지지 않지만 void 요소의 trailing slash는 기능합니다.

한 가지 더 주의: HTML5 문서를 XML로 나타낼 수 있으며, 이를 "XHTML 5.0"이라고 부르기도 합니다.이 경우 XML 규칙이 적용되고 태그가 자동으로 닫힙니다.항상 XML MIME 유형을 사용해야 합니다.

자체 닫기 태그는 HTML5에서 유효하지만 필수는 아닙니다.

  ★★★★★★★★★★★★★★★★★」 다다다다다괜

이 예에서 알 수 있듯이 자동 닫힘 태그에는 매우 주의를 기울입니다.

var a = '<span/><span/>';
var d = document.createElement('div');
d.innerHTML = a
console.log(d.innerHTML) // "<span><span></span></span>"

내 직감으로는 대신에