資料結構
網路
關係資料庫管理系統(RDBMS)
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理
化學
生物
數學
英語
經濟學
心理學
社會學
服裝設計
法學如何隱藏不支援 JavaScript 的舊版瀏覽器中的 JavaScript 程式碼？
JavaScript 的 script 標籤有時不被舊版瀏覽器識別。如果不被識別，它們只會忽略它，並將您的指令碼顯示為 (X)HTML 文件正文的一部分。為了防止這種情況發生，使用註釋隱藏舊版瀏覽器中的指令碼是一個明智的選擇。
現在所有現代瀏覽器都支援 JavaScript；但是，早期瀏覽器不支援。在這篇文章中，我們將學習如何防止 JavaScript 程式碼在舊版瀏覽器中執行。
由於一些觀眾會在手機上檢視網站，而另一些人則使用大型桌上型電腦螢幕，因此網站不可能在所有瀏覽器中看起來完全相同。同樣，一些使用者會使用過時的瀏覽器，而另一些使用者則會使用最新的瀏覽器。一些使用者可能會使用螢幕閱讀器來收聽資訊，或者可能會放大以閱讀。提供一個防禦性構建的版本的內容，使其在現代瀏覽器上看起來很棒，但對於舊版瀏覽器的使用者來說仍然可以在基本級別上使用，這就是“支援所有人”的概念。
策略 − 我們將使用單行 HTML 註釋，在開啟 <script> 標籤後不使用結束符 (<!- )。之後，我們將建立 JavaScript 程式碼，該程式碼將對早期瀏覽器隱藏。在我們使用註釋的結束符 (//-->) 之前，指令碼將用 </script> 標籤關閉。
語法
<script>
<!--
// Your JavaScript code
// that is hidden from older browser
console.log("Tutorials Point");
//-->
</script>
示例 1
在這個例子中，讓我們瞭解一下，如果瀏覽器是支援 JavaScript 的瀏覽器，則背景顏色將更改為紅色；否則，它將保持黃色。
<!DOCTYPE html>
<html>
<title>How can JavaScript code be hidden from old browsers that do not support JavaScript - TutorialsPoint</title>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body bgcolor="green">
<h1 style="text-align: center; font-size: 3rem;">
Learn JavaScript with TutorialsPoint!
</h1>
<script type="text/javascript">
<!--
document.bgColor = "orange";
//-->
</script>
</body>
</html>
我們可以觀察到，過時的瀏覽器會忽略 JavaScript 程式碼並將其視為 HTML 註釋，而當前瀏覽器可以毫無問題地訪問 JavaScript 程式碼。
當瀏覽器支援 JavaScript 時，顯示橙色，如上例中新增的樣式所示。
接下來，當瀏覽器不支援 JavaScript 時，顯示綠色，如上例中新增的樣式所示。
示例 2
對於支援 JavaScript 的瀏覽器，這種指令碼隱藏方法也有效。指令碼的第一行和最後一行用作其標題。客戶端的 JavaScript 直譯器知道 HTML 註釋開啟字串，但是，將其視為單行註釋處理。
因此，第二行在支援 JavaScript 的瀏覽器中被視為單行註釋。類似地，您可以看到下面一行以單行註釋字串開頭兩次，因此支援 JavaScript 的瀏覽器也會跳過該行。現在只有第三到第五行繼續作為 JavaScript 語句執行。
雖然需要一些時間來適應，但這 種簡單而優雅的 HTML 和 JavaScript 註釋組合實現了我們想要的目標，即防止不支援 JavaScript 的瀏覽器顯示 JavaScript 程式碼。儘管現在需要它的瀏覽器越來越少，但在網際網路上的 JavaScript 程式碼中仍然經常看到這種註釋。
<!DOCTYPE html>
<html>
<title>How can JavaScript code be hidden from old browsers that do not support JavaScript - TutorialsPoint
</title>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body style="text-align:center">
<h2> Visit TutorialsPoint! </h2>
<div id="result"> </div>
<script langauge="JavaScript">
<!-- start an HTML comment to hide the script
// Here are the JavaScript statements.
//
//
// close the HTML comment which hides the script -->
const date = new Date();
document.getElementById("result").innerHTML = (date);
</script>
</body>
</html>
瀏覽量 507 次
