Existe-t-il un moyen de sélectionner des éléments qui utilisent une propriété CSS3 spécifique?

Question

Je voulais sélectionner tous les éléments dans le DOM qui ont un rayon de frontière! == 0.

Est-ce que vous connaissez un moyen de faire cela?

Answer 1

Oui. Utilisez la fonction .filter().

$(elements).filter(function(){ 
    return parseInt($(this).css("border-radius"),10) != 0; 
}); 

Answer 2

Utilisez une classe CSS pour définir votre rayon de bordure, puis utilisez jQuery pour les sélectionner.

CSS:

.border-radius { 
    border-radius: 4px; 
} 

JS:

$('.border-radius') 

Answer 3

Parce que je veux être complet, nous devons considérer le fait que border-radius peut accepter plusieurs valeurs pour décrire les quatre coins individuellement:

$('*').filter(function() { 
    var br = $(this).css("border-radius").split(' '), 
     test = false; 
    for (var i = 0, j = br.length; i < j; i++) { 
     test = test || parseInt(br[i], 10); 
    }; 
    return test; 
}) 

http://jsfiddle.net/mblase75/SLUcb/

Cela dit, le filtrage CHAQUE élément sur la page est outrageusement inefficace. La meilleure approche consiste simplement à affecter le border-radius à une classe et à tester l'existence d'objets avec cette classe.