如何在JavaScript中有效轉義HTML字元？

如何在JavaScript 中執行HTML 字符轉義

在JavaScript 中處理HTML 資料時，通常需要轉義特殊字符，例如< ;、> 和& 以防止它們被解釋為標記語法。雖然 PHP 為此目的提供了一個名為 htmlspecialchars 的本機函數，但 JavaScript 沒有直接等效的函數。

實作 HTML 字元轉義函數

模擬 htmlspecialchars 的功能在 JavaScript 中，您可以建立自訂函數。但是，如果可用，最好使用內建函數。

ES6 範本文字

ES6 引入了範本文字，它提供了一種轉義 HTML 字元的便捷方法。但是，此方法僅轉義每個特殊字元的第一次出現，從而導致包含相同字元的多個實例的字串結果不正確。

自訂替換函數

至確保正確轉義，可以使用自訂替換函數。此函數將每個特殊字元替換為其對應的HTML 實體：

function escapeHtml(text) {
  return text
      .replace(/&/g, "&")
      .replace(/</g, "&amp;lt;")
      .replace(/>/g, "&amp;gt;")
      .replace(/&quot;/g, "&amp;quot;")
      .replace(/'/g, "&#039;");
}

使用字元對映表

為了提高大文字區塊的效能，可以使用字元對映表用於更有效率地取代特殊字元：

function escapeHtml(text) {
  var map = {
    '&': '&',
    '<': '&amp;lt;',
    '>': '&amp;gt;',
    '&quot;': '&amp;quot;',
    "'": '&#039;'
  };
  
  return text.replace(/[&amp;<>&quot;']/g, function(m) { return map[m]; });
}

透過使用這些技術，您可以在JavaScript 中有效轉義HTML字符，確保它們在 HTML 文件中正確顯示。

以上是如何在JavaScript中有效轉義HTML字元？的詳細內容。更多資訊請關注PHP中文網其他相關文章！