如何检查X个具有相同类但不同ID的元素是否具有一个特定的CSS属性相同？

Question

How can i check if X number of elements with same class but different id have one specific css property identical? Imagine that there are 20 elements or somewhere like this with same class. Like here

<div class="back" id="i1"></div>
<div class="back" id="i2"></div>
<div class="back" id="i3"></div>

<style>
   back{width:100px;height:100px;float:left;}
   #i1{background-image:url(img1.jpg);}
   #i2{background-image:url(img2.jpg);}
</style>

And if they are identical i add a class but i suppose that would be easy. An example of what i have is here

Answer 1

To test css properties you can use .css() , for example:

if ($('#i1').css('background-image') == $('#i2').css('background-image')) {
    // do something
}

Let's say you want to check whether all the ".back" divs have the same background-image (I hope it's what you're trying to achieve). You could go with something like this:

var same = 1;
var property = $(".back").first().css('background-image');
$(".back").each(function() {
    if ($(this).css('background-image') != property)
        same = 0;
});
if (same == 1) {  // all properties where the same 
    // do something
}

Answer 2

I can't really see where your going with this, but you can do something on these lines.

var arr = [];
$.each($('.back'), function() {
  arr.push($(this).css('background-image'));
});

Or maybe,

$.each($('.back'), function() {
    if ($(this).css('background-image') === 'lookingForThis.jpg') {
        alert('Found it!');  
}
});