javascript - 如何在 jQuery 中访问新伪选择器中的参数

Question

我想创建伪选择器：regex 来回答这个问题：jQuery Selector with regex并想写完整的例子，但它抛出异常

TypeError: Cannot read property '3' of undefined

我的代码：

jQuery.expr[':'].regex = function(elem, index, match) {
    new RegExp(match[3]);
};

当我这样做console.log(arguments)时，它只显示两个参数元素和文档，API 是否发生了变化还是什么？如何访问伪选择器的参数？

Answer 1

这可能不适用于您的情况，但我想在这里为未来的搜索者提供它。

$.fn.regexFilter = function (expression, flags) {
    flags = flags != null ? flags : "g";

    if (expression.constructor === String) {
        // simple string expression
        expression = new RegExp(expression, flags);
    } else if (expression.constructor === Array) {
        // turns ["a", "b", "c"] into (a)|(b|(c)
        expression = new RegExp("(" + expression.join(')|(') + ")", flags);
    }
    // objects in the form of {expression: "foo", flags: "gim" }
    else if (typeof expression === "object" && expression.foo) {
        expression = new RegExp(expression.expression, expression.flags != null ? expression.flags : flags);
    } else if (expression.constructor !== RegExp) {
        // otherwise we assume no mathes
        return $();
    }

    // list of matches
    var matches = [];

    // list of matching elements
    var $matches = this.filter(function () {
        var haystack = $(this).text();
        var match = haystack.match(expression);

        matches.push(match);
        $(this).data('match', match);

        return !!match;
    });

    $matches.matches = matches;

    return $matches;
};

这些都是等价的，并且匹配任何<p>以“c”开头的单词：

$('p').regexFilter('\\bc\\w+', 'g').css({
    color: 'green'
});

$('p').regexFilter(/\bc\w/g).css({
    color: 'green'
});

$('p').regexFilter({expression: '\\bc\\w+', flags: 'g'}).css({
    color: 'green'
});

您还可以检索任何函数中的子匹配项。这里我们匹配前两个单词。第二个字存储在组 1 中。

$('p').regexFilter(/^\w+\s(\w+)/).each(function () {
    var match = $(this).data('match');
    var oldText = ["the second word of <i>", $(this).text(), "</i> is", match[1]].join(" ");
    $(this).html(oldText);
});

您也可以只获取所有元素的匹配数组。

var $matchedElements = $('p').regexFilter(/^\w+\s(\w+)/);
var matches = $matchedElements.matches;
matches[3][1] // the second word of the 4th p

注意这个匹配数组不会持久化，数组中会有nulls。所以第 4 个 p 是$(p)[3]，不是$matchedElements[3]。

小提琴