带有 jQ​​uery 的 Javascript 正则表达式包含正则表达式扩展

Posted 2023-02-23

【中文标题】带有 jQ​​uery 的 Javascript 正则表达式包含正则表达式扩展

【英文标题】：Javascript Regular Expressions with jQuery Contains Regex Extension

【发布时间】：2012-02-13 10:01:57

【问题描述】：

我正在使用 jQuery 的扩展“contains”，如下所示：

$.extend($.expr[':'],
    containsExact: function(a,i,m)
        return $.trim(a.innerhtml.toLowerCase()) === m[3].toLowerCase();
    ,
    containsExactCase: function(a,i,m)
        return $.trim(a.innerHTML) === m[3];
    ,
    containsRegex: function(a,i,m)
        var regreg =  /^\/((?:\\\/|[^\/])+)\/([mig]0,3)$/,
        reg = regreg.exec(m[3]);
        return RegExp(reg[1], reg[2]).test($.trim(a.innerHTML));
    
);

我有一个包含某些单元格的表格，我正在尝试有条件地格式化，所以我在td 选择器中使用扩展名，并带有containsRegex 函数。我遇到的问题是我尝试使用的许多正则表达式（我已经在 this 这样的 javascript 正则表达式测试器上测试过并且他们已经工作了）不适用于这个函数。这些是我想匹配的各种字符串：

请注意，“x”可以是 ax、t、f 或 v，“X”可以是 X、T、F 或 V。最后，“(mb)”可以是任意两个小写字母 az括号。

-, (mb), x*, x*(mb), x, x(mb), X*, X*(mb), X

下面是我正在使用的几个正则表达式的代码：

 $("td:containsExact('-')").addClass("0 queue"); // -
 $("td:containsRegex('/[^xtfv*]\([a-z]2\)/g')").addClass("1 active"); // (mb)
 $("td:containsRegex('/\b[xtfv]\*(?!\()/g')").addClass("2 queue review"); // x*
 $("td:containsRegex('/\b[xtfv]\*(?:\([a-z]2\))/g')").addClass("3 active review"); // x*(mb)
 $("td:containsRegEx('/\b[xtfv](?![*\(])/g')").addClass("4 queue");  // x
 $("td:containsRegEx('/\b[xtfv](?:\([a-z]2\))/g')").addClass("5 active");  // x(mb)
 $("td:containsRegEx('/\b[XTFV]\*(?!\()/g')").addClass("6 queue review");  // X*
 $("td:containsRegEx('/\b[XTFV]\*(?:\([a-z]2\))/g')").addClass("7 active review");  // X*(mb)
 $("td:containsRegEx('/\b[XTFV](?![*\(])/g')").addClass("8 done");  // X

Chrome 中的大多数此类通过错误。有没有人有任何指示？包含扩展名是否受到某种限制？

提前感谢您的帮助！

【问题讨论】：

供参考：它传递的错误是“x*”和“X*”上的“Uncaught Syntax error, unrecognized expression: )/g')”。它适当地将类应用于“（mb）”，但也将这些相同的类应用于“x *（mb）”......其余的搜索不会传递错误，但它们也找不到匹配项。跨度>

【参考方案1】：

好的，我想我明白了...这些是我所做的更改：

底部的五个选择器有一个大写的“E”并且都应该是“containsRegex()”

我通过在返回中添加“reg”检查稍微更改了 containsRegex，以使其更加坚固：

containsRegex: function(a,i,m)
  var regreg =  /^\/((?:\\\/|[^\/])+)\/([mig]0,3)$/,
   reg = regreg.exec(m[3]);
  return reg ? RegExp(reg[1], reg[2]).test($.trim(a.innerHTML)) : false;

正则表达式中的所有转义字符都需要进行双重转义（即\( 需要为\\(）

我删除了所有单引号以真正帮助我避免分心

我删除了班级名称编号。我知道 ID 不应该以数字开头，而且我很确定类名也不应该以数字开头或只是一个数字。无论如何，这导致一些选择器添加了相同的正则表达式（即“x”和“-”看起来相同，以及“x*(mb)”和“X*(mb)”与演示中的 css）。

无论如何，我会用这段代码和你的demo更新我的要点：

/* jQuery selector to match exact text inside an element
*  :containsExact()     - case insensitive
*  :containsExactCase() - case sensitive
*  :containsRegex()     - set by user ( use: $(el).find(':containsRegex(/(red|blue|yellow)/gi)') )
*/
$.extend($.expr[':'],
  containsExact: function(a,i,m)
    return $.trim(a.innerHTML.toLowerCase()) === m[3].toLowerCase();
  ,
  containsExactCase: function(a,i,m)
    return $.trim(a.innerHTML) === m[3];
  ,
  containsRegex: function(a,i,m)
    var regreg =  /^\/((?:\\\/|[^\/])+)\/([mig]0,3)$/,
    reg = regreg.exec(m[3]);
    return reg ? RegExp(reg[1], reg[2]).test($.trim(a.innerHTML)) : false;
  
);

// -, (mb), x*, x*(mb), x, x(mb), X*, X*(mb), X

$("td:containsRegex(/^[xtfv]$/)").addClass("queue");  // x
$("td:containsRegex(/^[xtfv]\\*$/)").addClass("queue review"); // x*
$("td:containsRegex(/^\\([a-z]2\\)$/)").addClass("active"); // (mb)
$("td:containsRegex(/^[xtfv]\\([a-z]2\\)$/)").addClass("active");  // x(mb)
$("td:containsRegex(/^[xtfv]\\*\\([a-z]2\\)$/)").addClass("active review"); // x*(mb)

$("td:containsRegex(/^[XTFV]$/)").addClass("done");  // X
$("td:containsRegex(/^[XTFV]\\*$/)").addClass("queue review");  // X*
$("td:containsRegex(/^[XTFV]\\*\\([a-z]2\\)$/)").addClass("active review");  // X*(mb)

$("td:containsExact(-)").addClass("queue"); // -

【讨论】：

哦，伙计——效果很好。我完全忽略了双重转义，我知道我理解背后的逻辑。 Regex 与 RegEx 的事情对我来说有点愚蠢，但我很高兴你明白了。我感谢您对 contains 扩展名所做的更改。这真的是一段非常棒的代码，所以再次感谢您！

我已更新 the gist，其中包含此代码以用于 jQuery 1.8+。请注意，由于 expr 函数的更改，:containsRegex() 函数现在确实需要括号内的引号。

【参考方案2】：

"td:containsRegex('/\b[xtfv]\*(?!\()/g')"

\b 在字符串文字中表示退格（"\b" === "\x08"），而在正则表达式中表示分词。尝试将所有\b 替换为\\b。

您还应该正确地将 \( 更改为 [(]，因为在 JS 中，"foo\(bar\)" === "foo(bar)"。

【讨论】：

不幸的是，唯一有帮助的是将 ( 替换为 [(] 搜索“x*”和“X*”) - 但所做的只是防止我原来的评论中提到的错误. 尽管如此，唯一触发的是“（mb）”，不幸的是，它仍在为“x *（mb）”应用触发器......不过谢谢。我想这是故障排除的所有部分。跨度>