jquery si (css_attribute = valeur)

La css méthode JQuery, lors d'un seul paramètre, retourne la valeur de la donnée paramenter. Vous pouvez essayer ceci:

var color = $('.box').css('background-color');
if (color == 'rgb(0, 0, 255)' || color == 'blue') //=='blue' <- IE hack
    alert("it's blue!\nColor detected: " + color);

L'exemple ci-dessus ne fonctionne que pour le premier élément dans le sélecteur JQuery, par conséquent, vous devez utiliser le .each méthode JQuery pour itérer sur l'ensemble du sélecteur si vous avez plus d'un élément en elle.

Veuillez noter que le .css JQuery méthode retourne un mélange RVB dans la plupart des navigateurs (sauf IE), afin de le tester contre une chaîne telle que blue ne suffira pas pour les non-IE navigateurs. Vous pouvez tester que dans le JQuery API site et mon violon.

Et voici le bon .each itération:

$('.box').each(function(i){
    var color = $(this).css('background-color');
    if (color == 'rgb(0, 0, 255)' || color == 'blue') //=='blue' <- IE hack
        alert("div " + i + " is blue!\nColor detected: " + color);
});​

JSFiddle

---

Edit: plus d'un an et demi plus tard, je me sens comme cette réponse mérite une mise à jour.

Pour la plupart des cas d'utilisation, je vous recommande d'utiliser une classe CSS:

.blue {
    color: blue;
}

Cela permet l'utilisation de la addClass()removeClass()toggleClass() méthodes de manipulation, ainsi que hasClass() pour vérifier:

if ( $('#myElem').hasClass('blue') ) {
    //it has the .blue class!
}

Cela fonctionne parfaitement dans tous les navigateurs sans avoir besoin de bidouilles, et en tant que plus vous bénéficiez d'une meilleure séparation des préoccupations: c'est, si votre style ne change jamais, dire .blue { color: lightblue; }le JS va continuer à travailler sans modifications.

Remarque: bien entendu, cette approche n'est pas adapté pour un couple de rares cas d'utilisation où la valeur de la couleur est généré dynamiquement (par exemple à l'aide de Math.random() ou choisir une couleur de valeur off une toile de pixels), dans ces rares cas d'utilisation, vous pouvez toujours utiliser la première solution dans cette réponse.

boxes = $('.box');
for(var i = 0;i<boxes.length;i++) {
  if(boxes[i].style.backgroundColor =="blue") {
    //do stuff
  }
}

Aucune de ce qui précède semble fonctionner ici à 2015. Le test d'un lien de couleur contre le :visité la couleur semble être vrai dans tous les cas en Chrome pour moi. Aussi, si vous n'êtes pas le "sniffing" et veulent vraiment savoir si un lien a été cliqué lors de leur visite à VOTRE site web, j'ai trouvé qu'un simple:

$("a").addClass('visited');

et de vérification pour la classe fonctionne très bien.

if ( $("a").hasClass('visited'); ){ console.log('do something honorable'); }