Używanie tagu komentarza HTML <! - -> nadal dotyczy kodu JavaScript?

80

Czy nadal warto używać tagu komentarza HTML wokół kodu JavaScript?

mam na myśli

<html>
    <body>
        <script type="text/javascript">
            //<!--
            document.write("Hello World!");
            //-->
        </script>
    </body>
</html>
javascript browser rajakvk
źródło
Proszę wziąć pod uwagę JavaScript używany obok przeglądarek. Wyklucz także bardzo stare przeglądarki.
rajakvk

Odpowiedzi:

108

Komentarze HTML, tj. <!-- -->, nie są już potrzebne. Miały na celu umożliwienie przeglądarkom, które nie rozumieją <script>tagu, bezproblemowej degradacji. Te przeglądarki, np. Netscape 1.x nie występuje już w środowisku naturalnym. Więc naprawdę nie ma już sensu umieszczać komentarzy HTML w tagach skryptu.

Jeśli chcesz, aby Twój HTML był weryfikowany jako XHTML lub XML, prawdopodobnie chcesz użyć zakomentowanego znacznika CDATA.


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

Powodem tego jest tak swoje <, >, &, "i 'które są częścią kodu JavaScript nie będą musiały być zakodowane jako &lt;, &gt;, &amp;, &quot;i &apos;odpowiednio.

Asaf
źródło
3
Co robisz, gdy chcesz dołączyć „]]>” jako część ciągu?
dreamlax
6
@dreamlax: Będziesz musiał rozbić to na kawałki. Ludzie mają ten sam problem, z </script>którym zazwyczaj dostaje rozbici na </scri ipt>.
Asaph
6
Właściwie może być sens w używaniu komentarzy html wokół kodu js do dziś. Googlebot zaindeksuje każdy ciąg znaleziony w kodzie js, który „wygląda jak adres URL” (zgodnie z kryteriami „nie wiem”), tak jakby to był link. Wiem, że to totalnie szaleństwo, ale tak jest. W wielu przypadkach możesz mieć ciągi znaków, które wyglądają jak adresy URL, ale nie są prawidłowymi adresami URL, więc nie chcesz, aby robot indeksujący Google drażnił Twój serwer bezsensownymi żądaniami. Jakiś facet, który wydaje się wiedzieć, co mówi, upewnia się, że googlebot nie będzie indeksował ciągów js typu look-like-url, jeśli kod js jest zawarty w komentarzach HTML. goo.gl/ZRW1Y nie próbował tego
matteo
2
@dreamlax ]]>]]<![CDATA[>☺
IllidanS4 obsługuje Monikę
1
Jeśli celem jest wygoda walidatorów HTML / XML (obecnie wielu dobrze to rozumie <script>), to nie widzę znaczącej przewagi CDATAbloku nad tradycyjnym komentarzem. Jedyną różnicą jest to, czy <script>oficjalnie ma treść, czy nie - a jeśli chodzi o wyszukiwarki, możemy chcieć, aby nie zawierała treści ...
BurninLeo
23

Niezupełnie, chyba że kierujesz reklamy na 20-letnie przeglądarki.

Sasha Chedygov
źródło
6
Nie, Internet Explorer 2. Netscape obsługiwał Javascript od 2.0
MarkR
1
@kangax: Gorzej niż to - Netscape Navigator 2, jeśli dobrze pamiętam.
Chuck
14

Lepiej jest po prostu unikać razem JavaScript w treści. Ułatwia aktualizację, pozwala uniknąć komentarzy i zmusza do planowania dla użytkowników nieobsługujących JavaScript, a także użytkowników z włączoną obsługą JavaScript.

scragar
źródło
8
Czasami posiadanie całego .jskodu JavaScript w plikach zamiast w kodzie HTML utrudnia aktualizację, ponieważ .jspliki mogą być buforowane.
Asaph
11
Łączę moje pliki javascript z folderu, który ma w nazwie aktualną wersję mojej aplikacji internetowej.
herzmeister
3
Inną powszechną taktyką wielu witryn i platform, takich jak wordpress, jest dodanie ciągu zapytania do identyfikatora URI pliku js, aby wymusić ponowne załadowanie pliku, gdy zmieni się ciąg zapytania. np .:<script type="text/javascript" src="http://example.com/path/to/file.js?v1.0"></script>
Will B.
5

Nie w taki sposób, w jaki to robisz, nie.

<! - jest traktowany tak samo jak // w javascript, więc zamiast tego twój kod powinien wyglądać następująco:

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

... z tą różnicą, że rzadka, mało znana przeglądarka, która może nie rozumieć tagu skryptu, wydrukuje otwierający // na ekranie, co w pewnym sensie uniemożliwia umieszczenie tagu komentarza w tym miejscu.

Tutaj jest więcej informacji na ten temat, jeśli jesteś ciekawy: http://www.javascripter.net/faq/comments.htm

Jednak w końcu nawet bardzo niejasne przeglądarki, które domyślnie nie obsługują javascript (takie jak przeglądanie HTMLLayout lub Netsurf), wiedzą, że najlepiej nie renderować tekstu między tagami skryptu, więc nie, nie jest to już istotne. Jednak wszystkie przeglądarki, na których może Ci zależeć, rozumieją składnię <! -, więc nie ma potrzeby szaleńczo martwić się o usunięcie go z tego, co już masz, ponieważ jest to poprawny js, po prostu pamiętaj, aby nie dodawać go następnym razem.

i dlaczego warto
źródło
0

Nawet w nowoczesnych przeglądarkach może być przydatne. Właściwie natknąłem się dzisiaj na ten problem, właśnie dlatego, że chciałem uniknąć umieszczania javascript w moim html.

Mam stronę HTML, na której jest wyświetlana, na http://host/variable_app_name/pagenamektórej variable_app_namemoże mieć wiele wartości (wiesz, zmienna). Jeśli chce uzyskać dostęp do plików statycznych, musi użyć adresu URL takiego jak http://host/static/variable_app_name/filename, więc nie mogę określić lokalizacji pliku statycznego bez uprzedniego sprawdzenia lokalizacji przeglądarki, aby znaleźć wartość variable_app_name.

Aby utworzyć łącze do głównego pliku javascript, wykonuję następujące czynności:

<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>

Powyższy kod wybuchnie nawet w najnowszej wersji Chrome, ponieważ tag skryptu zostanie zakończony w środku ciągu javascript, a pozostała część ciągu zostanie zinterpretowana jako html, tak jak poniżej:

<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>

Jest wiele sposobów, aby to naprawić, ale ja lubię używać komentarza HTML.

Z komentarzem 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>

Podział ciągu 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"></scr'+'ipt>\n');
</script>

Utwórz i dołącz znacznik script zamiast używać 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>

Lubię używać komentarza HTML, ponieważ jest to zwięzła zmiana i nie będzie potrzeby replikowania ani myślenia o każdym połączonym pliku.

Jools
źródło