Schlagwort-Archive: match

Regexp Selektor in JQuery

Auf dieser Seite hat James Padolsey eine äußerst hilfreiche Funktion für JQuery vorgestellt. Zwar ist es mit dem CSS3 Attribut-Selektor möglich elemtentare regulärer Ausdrücke zu formulieren, aber diese JQuery-Funktion ist schon sehr fein:
[sourcecode language=“jscript“]
jQuery.expr[‚:‘].regex = function(elem, index, match) {
var matchParams = match[3].split(‚,‘),
validLabels = /^(data|css):/,
attr = {
method: matchParams[0].match(validLabels) ?
matchParams[0].split(‚:‘)[0] : ‚attr‘,
property: matchParams.shift().replace(validLabels,“)
},
regexFlags = ‚ig‘,
regex = new RegExp(matchParams.join(“).replace(/^\s+|\s+$/g,“), regexFlags);
return regex.test(jQuery(elem)[attr.method](attr.property));
}
[/sourcecode]

Ein paar Beispiele wie die Funktion benutzt werden kann:
[sourcecode language=“jscript“]
// Wählt alle Elemente aus, deren ID mit einem Vokal anfangen:
$(‚:regex(id,^[aeiou])‘);

// Wählt alle DIVs mit Klassen aus, die Zahlen enthalten:
$(‚div:regex(class,[0-9])‘);

// Wähle alle SCRIPT tags aus, die jQuery im src enthalten:
$(’script:regex(src,jQuery)‘);
[/sourcecode]
Bei der Benutzung ist darauf zu achten, dass Backslashes im regulären Ausdruck durch doppelte Backslashes ersetzt werden müssen (bspw. ^\w+$ -> ^\\w+$). Zudem wird nicht zwischen Groß- und Kleinschreibung unterschieden – ist also case insensitive.

Die Funktion lässt sich auch für CSS einsetzen:
[sourcecode language=“jscript“]
// Wähle alle Elemente mit einer Weite zwischen 100 und 300 aus:
$(‚:regex(css:width, ^[1-3]\\d{2}px$)‘);

// Wähle alle DIVs aus, die NICHT als Block angezeigt werden:
$(‚div:not(:regex(css:display, ^block$))‘);
[/sourcecode]