CODEWITHSUNDEEP
jqueryregex
Eric Herlitz
Eric Herlitz

Reputation: 26287

Regex to find data-src attributes with curly braces

I'm trying to find a good pattern finding elements looking like this

data-src="{{xxxx}}", the contents in the curly braces may shift

The idea is to get the contents from the data-src on document.ready and insert that into a new src attribute, i.e.

$("img:regex(class, EXPRESSION)").each(function() {
    $(this).attr('src', $(this).attr('data-src'));
});

Thanks

Upvotes: 1

Views: 183

Answers (2)

Schlaus
Schlaus

Reputation: 19212

If for some reason you absolutely do need regex, it could be something like this:

/<[^>]*data\-src="{{(.*)}}">/

< the opening tag

[^>]* any match number of any characters, except a >

data\-src="{{ the beginning of the data attribute

(.*) any number of any characters, capturing the result

}}"> the end of the data attribute

Upvotes: 0

iCollect.it Ltd
iCollect.it Ltd

Reputation: 93571

Why RexEx? Just not match the start and end of the attribute:

$('[data-src^="{{"][data-src$="}}"]').each(function() {
    $(this).attr('src', $(this).attr('data-src'));
});

JSFiddle: http://jsfiddle.net/574u9zh3/

Alternatively, use a RexEx inside a call to filter():

e.g.

$('div').filter(function(){
    var attr = $(this).data('src');
    // return true for any RexEx match you care to make
    return ...
}).each(function() {
    $(this).attr('src', $(this).attr('data-src'));
});

Note: For reading data- attributes, use data() instead.

$(this).attr('src', $(this).data('src'));

Upvotes: 3

Related Questions