HTML 주석 태그 <! —-> 사용은 여전히 ​​JavaScript 코드와 관련이 있습니까?


80

JavaScript 코드 주위에 HTML 주석 태그를 사용하는 것이 여전히 관련이 있습니까?

내말은

<html>
    <body>
        <script type="text/javascript">
            //<!--
            document.write("Hello World!");
            //-->
        </script>
    </body>
</html>

브라우저 옆에 사용되는 JavaScript를 고려하십시오. 매우 오래된 브라우저도 제외하십시오.
rajakvk

답변:


108

HTML 주석, 즉. <!-- -->, 더 이상 필요하지 않습니다. <script>태그를 이해하지 못하는 브라우저가 정상적으로 저하 되도록하기위한 것 입니다. 이러한 브라우저, 예. Netscape 1.x는 더 이상 야생에서 찾을 수 없습니다. 따라서 더 이상 스크립트 태그에 HTML 주석을 넣을 필요가 없습니다.

HTML을 XHTML 또는 XML로 확인하려면 주석 처리 된 CDATA 태그를 사용할 수 있습니다.


<script type="text/javascript">
//<![CDATA[
document.write("Hello World!");
//]]>
</script>

그 이유는 그래서 당신의 <, >, &, "'당신의 자바 스크립트 코드의 일부는 다음과 같이 인코딩 할 필요가 없습니다 &lt;, &gt;, &amp;, &quot;&apos;각각.


3
']]>'를 문자열의 일부로 포함하려면 어떻게합니까?
dreamlax 2010

6
@dreamlax : 조각으로 쪼개 야합니다. 사람들 </script>은 일반적으로 </scr및으로 분해되는 동일한 문제를 가지고 ipt>있습니다.
Asaph

6
실제로 오늘날에도 여전히 js 코드 주위에 html 주석을 사용하는 데 요점이있을 수 있습니다. Googlebot은 "URL처럼 보이는"(어떤 기준에 따라) js 코드에서 발견 된 모든 문자열을 링크 인 것처럼 크롤링합니다. 나는 그것이 완전히 demential하다는 것을 알고 있지만 그렇습니다. 대부분의 경우 URL처럼 보이지만 유효한 URL이 아닌 문자열이있을 수 있으므로 Google 크롤러가 말도 안되는 요청으로 서버를 성가 시게하는 것을 원하지 않습니다. 그가 말하는 것을 아는 것처럼 보이는 어떤 사람은 js 코드가 html 주석으로 묶여 있으면 googlebot이 URL과 같은 js 문자열을 크롤링하지 않도록 보장합니다. goo.gl/ZRW1Y havnt 시도 tho
matteo apr

2
@dreamlax ]]>]]<![CDATA[>
IllidanS4가 Monica 지원 '

1
목표가 HTML / XML 유효성 검사기를 확신시키는 것이라면 (요즘 많은 사람들이 <script>내용을 올바르게 이해하고 있음 ) CDATA기존 주석 위에있는 블록 의 큰 이점을 보지 못합니다 . 유일한 차이점은 여부입니다 <script>... 우리가 아무 내용이없는 것으로 검색 엔진에 대한 할 수 있습니다 - 공식적으로 내용 또는하지 않은
BurninLeo

23

20 년 된 브라우저를 대상으로하지 않는 한 실제로는 아닙니다.


6
아니요, Internet explorer 2. Netscape는 2.0에서 Javascript를 지원했습니다
MarkR

1
@kangax : 그보다 더 나쁘다 — 내가 올바르게 기억한다면 Netscape Navigator 2.
Chuck

14

본문에서 JavaScript를 모두 피하는 것이 좋습니다. 업데이트를 더 쉽게 만들고, 주석이 필요하지 않으며, JavaScript가 활성화 된 사용자뿐 아니라 JavaScript가 활성화되지 않은 사용자에 대해서도 계획을 세워야합니다.


8
.jsHTML 대신 파일에 모든 자바 스크립트 가 있으면 파일이 캐시 될 수 있으므로 업데이트하기가 더 어려워집니다.js .
Asaph

11
내 웹 응용 프로그램의 현재 버전이 이름에있는 폴더에서 내 javascript 파일을 연결합니다.
herzmeister 2010

3
워드 프레스와 같은 많은 웹 사이트 및 프레임 워크의 또 다른 일반적인 전술은 쿼리 문자열이 변경 될 때 파일을 강제로 다시로드하기 위해 js 파일 URI에 쿼리 문자열을 추가하는 것입니다. 예 :<script type="text/javascript" src="http://example.com/path/to/file.js?v1.0"></script>
Will B.

5

당신이하는 방식이 아닙니다.

<!-는 자바 스크립트에서 //와 동일하게 취급되므로 코드는 다음과 같이 표시되어야합니다.

<script type="text/javascript">
<!--
document.write("Hello World!");
//-->
</script>

.. 당신과 다른 점은 스크립트 태그를 이해하지 못할 수있는 드물게 모호한 브라우저가 여는 // 화면을 인쇄한다는 것입니다. 이것은 주석 태그를 처음에 넣는 목적에 위배됩니다.

궁금하다면 여기에 대한 자세한 정보가 있습니다. http://www.javascripter.net/faq/comments.htm

그러나 결국에는 기본적으로 자바 스크립트를 지원하지 않는 매우 모호한 브라우저 (예 : HTMLLayout Browse 또는 Netsurf)조차도 스크립트 태그 사이에 텍스트를 렌더링하지 않는 것이 가장 좋다는 것을 알고 있으므로 더 이상 관련성이 없습니다. 그러나 관심을 가질 수있는 모든 브라우저는 <!-구문을 이해하므로 유효한 js이므로 다음 번에 추가하지 않는 것을 기억하십시오.


0

최신 브라우저에서도 유용 할 수 있습니다. 나는 실제로 내 html에 자바 스크립트가 포함되는 것을 피하고 싶었 기 때문에 오늘이 문제에 직면했습니다.

에서 제공되는 html 페이지가 http://host/variable_app_name/pagename있는데, 여기서 variable_app_name많은 값 (알다시피, 변수)을 가질 수 있습니다. 정적 파일에 액세스하려면와 같은 URL을 사용해야 http://host/static/variable_app_name/filename하므로 먼저 브라우저의 위치를보고 variable_app_name.

기본 javascript 파일에 연결하려면 다음을 수행합니다.

<script type="text/javascript" >
   var variable_app_name = window.location.pathname.split('/')[1];
   document.write('<script type="text/javascript" src="/static/'+variable_app_name+'/pagename.js"></script>\n');
</script>

스크립트 태그는 자바 스크립트 문자열의 중간에서 종료되고 나머지 문자열은 다음과 같이 html로 해석되기 때문에 위의 코드는 최신 버전의 Chrome에서도 폭발 할 것입니다.

<script type="text/javascript" >
   var variable_app_name = window.location.pathname.split('/')[1];
   document.write('<script type="text/javascript" src="/static/'+variable_app_name+'/pagename.js">
</script>
\n');
</script>

이 문제를 해결하는 방법은 여러 가지가 있지만 html 주석을 사용하는 것을 좋아합니다.

HTML 주석으로 :

<script type="text/javascript" >
<!--
   var variable_app_name = window.location.pathname.split('/')[1];
   document.write('<script type="text/javascript" src="/static/'+variable_app_name+'/pagename.js"></script>\n');
-->
</script>

자바 스크립트 문자열 나누기 :

<script type="text/javascript" >
   var variable_app_name = window.location.pathname.split('/')[1];
   document.write('<script type="text/javascript" src="/static/'+variable_app_name+'/pagename.js"></scr'+'ipt>\n');
</script>

document.write를 사용하는 대신 스크립트 태그를 만들고 추가합니다.

<script type="text/javascript" >
   var variable_app_name = window.location.pathname.split('/')[1];
   var script = document.createElement('script');
   script.type = 'text/javascript';
   script.src = '/static/'+variable_app_name+'/pagename.js';
   document.head.appendChild(script);
</script>

간결한 변경이고 연결된 각 파일에 대해 복제하거나 생각할 필요가 없기 때문에 html 주석을 사용하는 것을 좋아합니다.

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.