CODEWITHSUNDEEP
jqueryjquery-selectors
Plexus81
Plexus81

Reputation: 1251

jQuery selector background-image

Is there a way to identify the selector is by the spesific background-image. Is there a way to do this? 

<ul style="background-image:url(/test/test/shortcutsMenu-test.png);">

I know this is not the right way to do it, but I'm manipulating a website to a mobile version of the same site.

Upvotes: 6

Views: 10219

Answers (3)

gdoron
gdoron

Reputation: 150253

one way of doing it is:

$('ul[style*="/test/test/shortcutsMenu-test.png"]')

JSFiddle example here

Upvotes: 2

R Hill
R Hill

Reputation: 1804

You'll presumably want the Attribute Contains Word selector: http://api.jquery.com/attribute-contains-word-selector/

$('[style~="/test/test/shortcutsMenu-test.png"]').get();

Edit: This is wrong. The Attribute Contains selector should be used in this case, as it will match to substrings rather than whitespace-delimited words:

$('[style*="/test/test/shortcutsMenu-test.png"]').get();

Upvotes: 0

James Allardice
James Allardice

Reputation: 165961

You could use filter:

$("ul").filter(function() {
    return $(this).css("background-image") === "url(/test/test/shortcutsMenu-test.png)"; 
});

This will allow you to select ul elements that have a background image defined elsewhere, not only inline. Here's a working example.

If you don't care about that, and the background image will always be applied inline in a style attribute, you could use an "attribute contains" selector with the style attribute.

Update (based on comments)

To just search for part of the file name you can use normal JavaScript string methods like indexOf (since the jQuery css method returns a string):

$("ul").filter(function() {
    return $(this).css("background-image").indexOf("findThisString") > -1; 
});

Upvotes: 9

Related Questions