Selecting a div without a .Class or #Id

Go To StackoverFlow.com

4

For some reason, it is much easier for me if it is possible to select all the divs that match a particular set of similar style attributes.

Example of div that I want to select

<div style="background-image: url(http://localhost/website/images/template/markers/cluster.png); height: 34px; line-height: 34px; width: 34px; text-align: center; cursor: pointer; color: rgb(255, 255, 255); position: absolute; font-size: 12px; font-family: Arial, sans-serif; font-weight: bold; top: 78.15521871251985px; left: 725.3256078213453px; background-position: 0px 0px; ">15</div>

Other than this div, other divs that needs to be selected can be similar to this one, but with say different height and top left positions. However, the good thing is that the background-image url() remains the same.

How can this selection be made with jQuery? Thank you !!

EDIT

Surrounding Code Easier to provide a screencap

enter image description here

2012-04-04 23:17
by Nyxynyx
left: 725.3256078213453px; ??? - jacktheripper 2012-04-04 23:20
I dunno what's worse, having inline styles like this in the first place or querying dom elements based on those inline style - Esailija 2012-04-04 23:21
i think you missed the whole point of jquery. just add a class perio - Ibu 2012-04-04 23:22
The inline styles were created by a google map library and I dont want to dig into the library and edit the code - Nyxynyx 2012-04-04 23:23
While I agree inline styles are bad and selecting from them is even worse, many libraries and CSS grid systems generate them and it is common to see obscure values like the ones above because they are percentage-based - Terry 2012-04-04 23:25
Please show us more surrounding code. Given that these are markers, they could be selected with child combinator (parent > child) with some reference element as their parent. Also, it's quite probable that Google Maps API provides a method to conveniently retrieve all markers at once - Marat Tanalin 2012-04-04 23:25
I added a screenshot of the code in the original post. Everything within #map_canvas is generated either by Google Maps API V3 or the Gmap library that I'm usin - Nyxynyx 2012-04-04 23:32


7

I don't think it's a good idea, but you can select elements by specific inline style with this:

$('div[style*="height: 34px"]')

Example

2012-04-04 23:19
by binarious
A note on this: This works only with inline styles as in your example - rcdmk 2012-04-04 23:22
This will give false matches when the style cssText contains "height: 34px;", for example "line-height: 34px"Esailija 2012-04-04 23:26
$('div[style*=" height: 34px"]') works because background-image is always the first style - binarious 2012-04-04 23:31
I would prefer to select using the background-image, because the desired divs to select all have the same background-imag - Nyxynyx 2012-04-04 23:32
Yeah works, too $('div[style*="background-image: url(http://localhost/website/images/template/markers/cluster.png);"]') BUT yuk!binarious 2012-04-04 23:33
as far as i know, you should be careful of the "phrases" on this one. a slight missing/added space can mean getting selected or not. "height: 34px" is not the same as "height:34px"Joseph 2012-04-04 23:34
@Joseph because the code is generated by google maps, the format should always be the same - binarious 2012-04-04 23:36
well, just saying. just incase : - Joseph 2012-04-04 23:36
For the generic case, you need to use filters in jQuery - sirhc 2012-04-04 23:47
Dirty, dirty, dirty...!! I can not understand why people still deny to use classes or ids. EVERYBODY'S life would be so much SIMPLER - Konstantinos Margaritis 2013-04-21 14:52
Ads