Sử dụng thẻ nhận xét HTML <! - -> vẫn phù hợp với mã JavaScript?

79

Việc sử dụng thẻ nhận xét HTML xung quanh mã JavaScript có còn phù hợp không?

Ý tôi là

<html>
    <body>
        <script type="text/javascript">
            //<!--
            document.write("Hello World!");
            //-->
        </script>
    </body>
</html>
javascript  browser 
— rajakvk
nguồn
Vui lòng xem xét JavaScript được sử dụng bên cạnh các trình duyệt. Cũng loại trừ các trình duyệt rất cũ.
— rajakvk

Câu trả lời:

108

Nhận xét HTML, tức là. <!-- -->, không còn cần thiết. Chúng nhằm mục đích cho phép các trình duyệt không hiểu <script>thẻ giảm cấp một cách duyên dáng. Các trình duyệt này, ví dụ. Netscape 1.x không còn được tìm thấy trong tự nhiên. Vì vậy, thực sự không có ích gì khi đưa các bình luận HTML vào các thẻ script của bạn nữa.

Nếu bạn muốn HTML của mình xác thực dưới dạng XHTML hoặc XML, bạn có thể muốn sử dụng thẻ CDATA được chú thích.


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

Lý do của việc này là để bạn <, >, &, "và 'là một phần của mã javascript của bạn sẽ không cần phải được mã hóa như &lt;, &gt;, &amp;, &quot;và &apos;tương ứng.

— Asaph
nguồn
3
Bạn phải làm gì khi muốn bao gồm ']]>' như một phần của chuỗi?
— dreamlax 14/02/10
6
@dreamlax: Bạn sẽ phải chia nó thành nhiều mảnh. Mọi người có cùng một vấn đề </script>mà thường sẽ được chia thành </scrvà ipt>.
— Asaph
5
Trên thực tế, có thể có một điểm trong việc sử dụng các bình luận html xung quanh mã js vẫn còn cho đến ngày nay. Googlebot sẽ thu thập dữ liệu bất kỳ chuỗi nào được tìm thấy trong mã js "trông giống như một url" (theo tiêu chí tôi-không biết) như thể đó là một liên kết. Tôi biết nó hoàn toàn mất trí nhớ nhưng nó có. Trong nhiều trường hợp, bạn có thể có các chuỗi trông giống như url nhưng không phải là url hợp lệ, vì vậy bạn không muốn trình thu thập thông tin của Google làm phiền máy chủ của bạn bằng các yêu cầu vô nghĩa. Một số người dường như biết những gì anh ta nói đảm bảo googlebot sẽ không thu thập dữ liệu các chuỗi js url trông giống như url nếu mã js được bao gồm trong các nhận xét html. goo.gl/ZRW1Y havnt try tho
— matteo
2
@dreamlax ]]>]]<![CDATA[>☺
— IllidanS4 hỗ trợ Monica
1
Nếu mục đích là để xác nhận trình xác thực HTML / XML (ngày nay nhiều người hiểu đúng về <script>nội dung), thì tôi không thấy lợi thế đáng kể của CDATAkhối phía trên nhận xét truyền thống. Sự khác biệt duy nhất là liệu <script>chính thức có nội dung hay không - và liên quan đến công cụ tìm kiếm, chúng tôi có thể muốn nó không có nội dung ...
— BurninLeo
23

Không hẳn, trừ khi bạn đang nhắm mục tiêu các trình duyệt 20 tuổi.

— Sasha Chedygov
nguồn
6
Không, Internet explorer 2. Netscape có hỗ trợ Javascript từ 2.0
— MarkR
1
@kangax: Tệ hơn thế - Netscape Navigator 2 nếu tôi nhớ không lầm.
— Chuck
14

Tốt hơn là chỉ cần tránh JavaScript trong nội dung cùng nhau. Nó giúp mọi thứ cập nhật dễ dàng hơn, tránh các nhu cầu nhận xét và buộc bạn phải lập kế hoạch cho người dùng không bật JavaScript cũng như người dùng đã bật JavaScript.

— ngu xuẩn
nguồn
8
Đôi khi có tất cả javascript của bạn trong .jstệp thay vì trong HTML, làm cho việc cập nhật khó hơn vì .jstệp có thể được lưu vào bộ nhớ cache.
— Asaph
11
Tôi liên kết các tệp javascript của mình từ một thư mục có tên là phiên bản hiện tại của ứng dụng web của tôi.
— herzmeister 14/02/10
3
Một thủ thuật phổ biến khác của nhiều trang web và khuôn khổ, chẳng hạn như wordpress, là thêm chuỗi truy vấn vào URI tệp js, để buộc tệp tải lại khi chuỗi truy vấn thay đổi. ví dụ:<script type="text/javascript" src="http://example.com/path/to/file.js?v1.0"></script>
— Will B.
5

Không phải theo cách bạn đang làm, không.

<! - được xử lý giống như // trong javascript, vì vậy mã của bạn thay vào đó sẽ giống như sau:

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

.. sự khác biệt với trình duyệt của bạn là một trình duyệt ít người biết đến có thể không hiểu thẻ script sẽ in // mở ra màn hình, điều này đã đánh bại mục đích của việc đặt thẻ nhận xét ở đó ngay từ đầu.

Đây là thông tin thêm về nó ở đây nếu bạn tò mò: http://www.javascripter.net/faq/comments.htm

Tuy nhiên, cuối cùng, ngay cả những trình duyệt siêu tối nghĩa không hỗ trợ javascript theo mặc định (như duyệt HTMLLayout hoặc Netsurf) biết rằng tốt nhất là không nên hiển thị văn bản giữa các thẻ script, vì vậy không, nó không còn phù hợp nữa. Tuy nhiên, tất cả các trình duyệt mà bạn có thể quan tâm đều hiểu cú pháp <! -, vì vậy không cần phải lo lắng điên cuồng về việc xóa nó khỏi những gì bạn đã có, bởi vì nó là j hợp lệ, chỉ cần nhớ đừng thêm nó vào lần sau.

— andwhyisit
nguồn
0

Ngay cả trong các trình duyệt hiện đại, nó có thể hữu ích. Tôi thực sự gặp phải vấn đề này hôm nay, chính xác là vì tôi muốn tránh nhúng javascript vào html của mình.

Tôi có một trang html được cung cấp trên đó http://host/variable_app_name/pagename, nơi variable_app_namecó thể có nhiều giá trị (bạn biết, biến). Nếu nó muốn truy cập các tệp tĩnh, nó phải sử dụng một url như http://host/static/variable_app_name/filenamevậy, vì vậy tôi không thể chỉ định vị trí tệp tĩnh trước tiên nếu không nhìn vào vị trí của trình duyệt để tìm giá trị của variable_app_name.

Để liên kết đến tệp javascript chính, tôi làm như sau:

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

Đoạn mã trên sẽ bùng nổ ngay cả trong phiên bản Chrome mới nhất, vì thẻ script sẽ được kết thúc ở giữa chuỗi javascript và phần còn lại của chuỗi sẽ được hiểu là html, như sau:

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

Có nhiều cách để sửa lỗi này, nhưng tôi thích sử dụng một bình luận html.

Với bình luận 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>

Chia nhỏ chuỗi 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>

Tạo và nối thẻ script thay vì sử dụng 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>

Tôi thích sử dụng nhận xét html vì đó là một thay đổi ngắn gọn và nó sẽ không cần sao chép hoặc suy nghĩ về mỗi tệp được liên kết.

— Trò đùa
nguồn
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookie và Chính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.