在前端开发中，我们经常需要将特殊字符编码为 HTML 实体，以避免它们被解释为 HTML 标签或其他语法。例如，如果我们要在网页中显示小于号（<）而不是将其解释为开始标签，则可以将其编码为 <。
在 JavaScript 中，我们可以使用内置的 encodeURIComponent 函数对字符串进行 URL 编码。但这个函数只会编码一部分 HTML 实体，例如空格会被编码为 %20，但它不会将小于号和大于号编码为它们的实体形式。
因此，我们可以使用自定义函数来实现 HTML 实体的编码。下面是一个示例代码：
-- -------------------- ---- -------
-------- --------------- -
------ -----------
-------------- --------
-------------- -------
-------------- -------
-------------- ---------
-------------- ---------
-
----- -------------- - --- --------------------------------------------
----- ------------- - ---------------------------
--------------------------- -- --- ------ --------------------------------------------------------------这里的 htmlEncode 函数使用了正则表达式来替换字符串中的特殊字符。& 符号被替换为 &，小于号和大于号分别被替换为 < 和 >，双引号被替换为 "，单引号被替换为 '。
除了编码字符串外，我们还应该注意如何解码字符串。在 JavaScript 中，我们可以使用内置的 innerHTML 属性以 HTML 格式呈现编码后的字符串。例如，
const encodedString = '<a href="https://www.example.com">Example</a>';
const decodedString = document.createElement('textarea');
decodedString.innerHTML = encodedString;
console.log(decodedString.value); // 输出: "<a href="https://www.example.com">Example</a>"这里的 textarea 元素将编码后的字符串作为其值，并且当我们访问 value 属性时，浏览器会自动将其解码为 HTML 格式。
综上所述，HTML 实体是在前端开发中非常有用的一种技术，它可以帮助我们避免出现意外的语法错误。在 JavaScript 中，我们可以使用自定义函数来编码字符串为 HTML 实体，并使用内置的 innerHTML 属性来解码字符串。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/27518