转义的 HTML 字符进行转义。

• 使用String.prototype.replace()方法与匹配需要转义的字符的正则表达式一起使用。
• 使用函数的回调，使用字典（对象）将每个转义字符实例替换为其关联的非转义字符。

JavaScript

const unescapeHTML = str =>
  str.replace(
    /&|<|>|'|"/g,
    tag =>
      ({
        '&': '&',
        '<': '<',
        '>': '>',
        ''': "'",
        '"': '"'
      }[tag] || tag)
  );

示例代码：

unescapeHTML('<a href="#">Me & you</a>');
// '<a href="#">Me & you</a>'

更多内容请访问我的网站：https://www.icoderoad.com

义字符串以在 HTML 中使用。

• 使用String.prototype.replace()方法与匹配需要转义的字符的正则表达式一起使用。
• 使用回调函数使用字典对象将每个字符实例替换为其关联的转义字符。

JavaScript

const escapeHTML = str =>
  str.replace(
    /[&<>'"]/g,
    tag =>
      ({
        '&': '&',
        '<': '<',
        '>': '>',
        "'": ''',
        '"': '"'
      }[tag] || tag)
  );

示例

escapeHTML('<a href="#">我 & 你</a>');
// '<a href="#">我 & 你</a>'

更多内容请访问我的网站：https://www.icoderoad.com

ext()方法会把包含的字符转义处理,html()则不会.所谓转义就是字符的另一种显示方法,例如"<" 显示成 "<",这就是转义了,其中的<就是<的转义字符.还有很多可以转义的字符,可以搜索下看看.

下边是项目中用到的2个语句:span中包含了jquery的语句输出结果.

1. $('.title').text("<img src=" ">");

显示结果为<img src=" ">,这里的<img src=" ">不会被解析成html的img标签,而是以存字母文字的形式显示,也就是单纯的字符串:<img src=" "> .并且f12查看源码时看到span包含的<img src=" ">文字内容外层有双引号哦.看下图,

​

如果你用右键选择编辑为html,则看到其中的转义字符<这就说明我们的<被转移了,

​

如果我们想把<img>显示成标签,被浏览器解析.那么就需要如下方法.

2. $('.title').html("<img >");

显示结果为解析后的html代码段,那么这里的<img >就会按照h5的标签img图片进行解析显示了.下图是f12的页面代码结果span中的<img>标签外层无双引号,且页面此时会显示出来图片.

​

​