수색…
소개
다른 프로그래밍, 마크 업 및 마크 다운 언어와 마찬가지로 HTML의 주석은 다른 개발자에게 사용자 인터페이스에 영향을주지 않고 개발 정보를 제공합니다. 그러나 다른 언어와 달리 HTML 주석은 Internet Explorer 용 HTML 요소 만 지정하는 데 사용할 수 있습니다. 이 주제에서는 HTML 주석과 함수 응용 프로그램을 작성하는 방법에 대해 설명합니다.
통사론
<!-- Comment text -->
비고
<!-- 시작하고 --> 로 끝나는 것은 주석입니다. 주석은 인접한 두 개의 대시 ( -- )를 포함 할 수 없으며 정확히 두 개의 대시로 끝나야합니다 (예 : ---> 가 맞지 않습니다).
댓글은 웹 페이지에 표시되지 않으며 CSS로 스타일을 지정할 수 없습니다. 페이지 개발자는 HTML 내에서 노트를 작성하거나 개발 중에 특정 컨텐츠를 숨길 수 있습니다.
동적 또는 대화 형 페이지의 경우 HTML 주석이 아닌 JavaScript 및 CSS를 사용하여 내용을 숨기고 표시합니다.
자바 스크립트는 HTML 주석 노드의 내용을 가져 오는 데 사용할 수 있으며 이러한 노드는 문서에서 동적으로 작성, 추가 및 제거 할 수 있지만 페이지 표시 방법에는 영향을 미치지 않습니다.
HTML 주석은 페이지 소스 코드의 일부이기 때문에 나머지 페이지와 함께 브라우저에 다운로드됩니다. 소스 코드는 일반적으로 웹 브라우저의 메뉴 옵션 "소스보기"또는 "페이지 소스보기"를 사용하여 볼 수 있습니다.
주석 작성
HTML 주석을 사용하여 코드의 특정 지점에 대한 노트를 자신이나 다른 개발자에게 남길 수 있습니다. 그들은 <!-- 로 시작될 수 있고 --> 결론 지을 수 있습니다 :
<!-- I'm an HTML comment! -->
다른 콘텐츠 내에서 인라인으로 통합 될 수 있습니다.
<h1>This part will be displayed <!-- while this will not be displayed -->.</h1>
더 많은 정보를 제공하기 위해 여러 줄에 걸쳐있을 수도 있습니다.
<!-- This is a multiline HTML comment.
Whatever is in here will not be rendered by the browser.
You can "comment out" entire sections of HTML code.
-->
그러나 다음과 같이 다른 HTML 태그 안에 나타날 수 없습니다 .
<h1 <!-- testAttribute="something" -->>This will not work</h1>
이것은 <h1 <!-- testAttribute="something" --> 블록 전체가 하나의 시작 태그 h1 로 간주되어 유효하지 않은 HTML을 생성하고 그 뒤에 무효 인 정보를 포함하고, 아무것도하지 않는 단일 > 닫기 괄호가옵니다.
XML 또는 SGML과 같은 HTML을 구문 분석하려고 툴과의 호환성을 위해, 당신의 의견의 몸은 두 개의 대시를 포함 할 수 없습니다 -- .
Internet Explorer의 조건부 주석
조건부 주석을 사용하면 여러 버전의 Microsoft Internet Explorer 코드를 사용자 지정할 수 있습니다. 예를 들어, 다른 HTML 클래스, 스크립트 태그 또는 스타일 시트를 제공 할 수 있습니다. 조건부 주석은 Internet Explorer 버전 5에서 9까지 지원됩니다. 이전 버전과 최신 Internet Explorer 버전 및 모든 비 IE 브라우저는 "하위 수준"으로 간주되어 조건부 주석을 일반 HTML 주석으로 취급합니다.
하위 레벨 숨김
하위 수준 숨겨진 주석은 일반적인 HTML 주석으로 보이는 내용 전체를 캡슐화하여 작동합니다. Internet Explorer 5에서 9까지만 조건부 주석으로 읽으며 콘텐츠를 숨기거나 표시합니다. 다른 브라우저에서는 내용이 숨겨집니다.
<!--[if IE]>
Revealed in IE 5 through 9. Commented out and hidden in all other browsers.
<![endif]-->
<!--[if lt IE 8]>
Revealed only in specified versions of IE 5-9 (here, IE less than 8).
<![endif]-->
<!--[if !IE]>
Revealed in no browsers. Equivalent to a regular HTML comment.
<![endif]-->
<!--
For purposes of comparison, this is a regular HTML comment.
-->
아래로 밝혀진
이것들은 하위 수준의 숨겨진 주석과 약간 다릅니다 : 조건문 주석 만이 일반 주석 구문 내에 포함됩니다. 조건부 주석을 지원하지 않는 브라우저는이를 무시하고 그 사이의 나머지 내용을 표시합니다.
<!--[if IE]>-->
The HTML inside this comment is revealed in IE 5-9, and in all other browsers.
<!--<![endif]-->
<!--[if IE 9]>-->
This is revealed in specified versions of IE 5-9, and in all other browsers.
<!--<![endif]-->
<!--[if !IE]>-->
This is not revealed in IE 5-9. It's still revealed in other browsers.
<!--<![endif]-->
인라인 요소 사이의 공백 주석 처리
인라인 표시 요소 (일반적으로 span 또는 a )는 문서에서 공백 문자를 앞뒤에 공백 문자 하나를 포함합니다. 마크 업 (읽기 어려운) 및 의도하지 않은 공백 (서식에 영향을 미침)에서 매우 긴 행을 피하기 위해 공백을 주석 처리 할 수 있습니다.
<!-- Use an HTML comment to nullify the newline character below: -->
<a href="#">I hope there will be no extra whitespace after this!</a><!--
--><button>Foo</button>
인라인 요소 사이에 주석없이 시도하면 두 요소 사이에 공백이 하나 있습니다. 때로는 공백 문자를 선택하는 것이 바람직합니다.
예제 코드 :
<!-- Use an HTML comment to nullify the newline character below: -->
<a href="#">I hope there will be no extra whitespace after this!</a><!--
--><button>Foo</button>
<hr>
<!-- Without it, you can notice a small formatting difference: -->
<a href="#">I hope there will be no extra whitespace after this!</a>
<button>Foo</button>
산출:
