混淆 :escape \ or not /\ in javascript 的正则表达式答案

【问题标题】：Confused :escape \ or not /\ in javascript's regular expression混淆 :escape \ or not /\ in javascript 的正则表达式
【发布时间】：2020-09-30 11:18:34
【问题描述】：

从字符串中提取 html 部分：

在正则表达式中使用转义：

RegExp('<script type="text\/javascript">[^]+<\/script>');

var content = '<p>test</p><script type="text/javascript">somany lines and \n\
                 so many lines</scr' + 'ipt>';
var reg_escape = new RegExp('<script type="text\/javascript">[^]+<\/scr' + 'ipt>');
var onlyHtml = content.replace(reg_escape,"");
alert(onlyHtml);

正则表达式中没有转义：

RegExp('<script type="text/javascript">[^]+</script>');

var content = '<p>test</p><script type="text/javascript">somany lines and \n\
                 so many lines</scr' + 'ipt>';
var reg_escape = new RegExp('<script type="text/javascript">[^]+</scr' + 'ipt>');
var onlyHtml = content.replace(reg_escape,"");
alert(onlyHtml);

它们都得到相同的结果——只提取 html 部分。现在在正则表达式中有一个带有转义的整个 html 文件：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <style type='text/css'>
    div#html{
        border:1px solid red;
        height:80px;
        width:80px;
        float:left;
    }
    div#content{
        clear:both;
        width:400px;
        height:400px;
        border:1px solid black;
    }
   </style>
</head>
<body>
    <div id='html'>html</div>
    <div id='content'>
    </div>        
    <script type='text/javascript'>
    var html_string = document.body.innerHTML;
    var content = document.getElementById('content');
    var ob_html = document.getElementById('html');
    var reg = new RegExp('<script type="text\/javascript">[^]+<\/script>');
    var onlyHtml = html_string.replace(reg,"");
    alert(onlyHtml);
   </script>    
</body>
</html>

另存为with_escape.html并用浏览器打开，从with_escape.html中提取html部分。

正则表达式中有一个没有转义的整个html文件：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <style type='text/css'>
    div#html{
        border:1px solid red;
        height:80px;
        width:80px;
        float:left;
    }
    div#content{
        clear:both;
        width:400px;
        height:400px;
        border:1px solid black;
    }
   </style>
</head>
<body>
    <div id='html'>html</div>
    <div id='content'>
    </div>        
    <script type='text/javascript'>
    var html_string = document.body.innerHTML;
    var content = document.getElementById('content');
    var ob_html = document.getElementById('html');
    var reg = new RegExp('<script type="text/javascript">[^]+</script>');
    var onlyHtml = html_string.replace(reg,"");
    alert(onlyHtml);
   </script>    
</body>
</html>

另存为without_escape.html，用浏览器打开，出现无法从without_escape.html中提取html部分。出现错误：

为什么在之前的代码 sn-p 中，无论是否将\ 转义为/\ 都不管？

【问题讨论】：

没有区别，因为"\/" 是/。

标签： javascript regex escaping

【解决方案1】：

在 JS 字符串文字中，/ 和 \/ 的含义完全相同。

在 HTML 文档中，</script> 是脚本元素的结束标记，但 <\/script> 不是。

没有\ 的版本在您将其嵌入 HTML 文档时会失败，因为您在表达式中间终止了脚本元素。

【讨论】：