javascript - 匹配不在 2 个字符串之间的正则表达式字符串

Question

我正在尝试查找未正确包装在 $(document).ready( 或 $(function()) 中的 jQuery 字符串。

所以它会匹配这个:

console.log('something');
$('button').trigger('click');
$('div').css('color','red');
console.log('something else');

但它与此不匹配:

$(document).ready(function(){
  // More js here
  $('label').trigger('click');
  $('div.something').text('hello');
  // more js here
});

或者这个

$(function(){
  $('.test').append('<div>taco</div>');
});

我尝试过这样做:

(?=\$\(document)[\s\S]*\$\([\s\S]*\}\)

但它的作用与我想要的相反......不知道如何做相反的事情......

Answer 1

我不知道如何使用一个正则表达式来完成此操作，但使用两个正则表达式已经(接近)一半了。

首先，找到您想要排除的任何 block ，并将其替换为空字符串。

我会使用以下正则表达式:

( RegEx101 Test Case )

/(?:\$|jQuery)\((?:document\)\.ready\()?function.*?\(\){(?:[^{]|{[^]*}\);?)+}\);?/gi

让我们分解一下:

• (?:\$|jQuery)查找“$”或“jQuery”，
• \(寻找“(”，
• (?:document\)\.ready\()? (可选)查找“document).ready(”,
• function寻找“功能”，
• .*?非贪婪地查找零个或多个任何东西(通常函数后面会跟着 () ，但有时使用命名函数，如 function namedFunc() )，
• \(\){查找“(){”，
• (?:[^{]|{[^]*}\);)+寻找一个或多个:
  • [^{]查找不是“{”的字符，或者:
    • {查找“{”符号，后跟
    • [^]*查找零个或多个非空内容(我会使用 .* ，但这与新行不匹配)，然后是，
    • }\);?查找带有可选“;”的“})”，
• }\);?查找带有可选“;”的“})”，
• g是一个标志，告诉 RegEx 引擎搜索多个匹配项，
• i是一个标志，告诉 RegEx 引擎以不区分大小写的方式进行搜索

替换完所有匹配项后，您可以搜索 jQuery 命令。执行此操作的正则表达式比以前的正则表达式简单得多。

( RegEx101 Test Case )

/(?:\$|jQuery)[(.].*?[;\n]/gi

让我们分解一下:

• (?:\$|jQuery)查找“$”或“jQuery”，
• [(.]查找“(”或“.”，
• .*?非贪婪地寻找零个或多个东西，
• [;\n]寻找 ”;”或“\n”，
• g是一个标志，告诉 RegEx 引擎搜索多个匹配项，
• i是一个标志，告诉 RegEx 引擎以不区分大小写的方式进行搜索

下面是一个示例脚本，它使用这两个正则表达式来查找您提供的示例输入中的命令。查看我上面提供的两个 RegEx101.com 测试用例，看看它如何处理一些不同的情况。

var regexes = [
    // https://regex101.com/r/dO7qR7/7 lots more tests here
    /(?:\$|jQuery)\((?:document\)\.ready\()?function.*?\(\){(?:[^{]|{[^]*}\);?)+}\);?/gi,
    // https://regex101.com/r/dO7qR7/8
    /(?:\$|jQuery)[(.].*?[;\n]/gi
], match, matches = [];

var string = [
    "console.log('something');",
    "$('button').trigger('click');",
    "$('div').css('color','red');",
    "console.log('something else');",
    "",
    "$(document).ready(function(){",
    "  // More js here",
    "  $('label').trigger('click');",
    "  $('div.something').text('hello');",
    "  // more js here",
    "});",
    "",
    "$(function(){",
    "  $('.test').append('<div>taco</div>');",
    "});"
].join('\n');

console.log(string);

string = string.replace(regexes[0], '');

console.log(string);

while(match = regexes[1].exec(string)) matches.push(match[0]);

console.log(matches);

// ["$('button').trigger('click');", "$('div').css('color','red');"]