1

I wanted to select all of the elements in the DOM that have a border-radius !== 0.

Do you guys know a way of doing that?

3
  • 2
    without assigning them a specific class? That won't be efficient... Oct 26, 2012 at 14:38
  • 1
    What about vendor-prefixed border radius support? Eg -moz-border-radius, webkit-border-radius, -o-border-radius, etc? EG the case where css('border-radius') returns nothing but css('-webkit-border-radius') returns something? Oct 26, 2012 at 16:07
  • 1
    @RoatinMarth The 1.8 version of jQuery addresses this with automatic CSS prefixing in the .css() method. Oct 26, 2012 at 16:46

3 Answers 3

6

Yes. Use the .filter() function.

$(elements).filter(function(){
     return parseInt($(this).css("border-radius"),10) != 0;
});
2
  • 2
    Shouldn't you parseInt($(this).css("border-radius"),10) before comparing it? Oct 26, 2012 at 14:42
  • 1
    Now we just need to deal with the rare but possible case where border-radius: 0px 2px.... Oct 26, 2012 at 14:45
4

Use a CSS class to define your border radius, then use jQuery to select them.

CSS:

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

JS:

$('.border-radius')
1
  • 1
    Probably not what the OP wanted, but still better than not changing HTML in terms of performance. Upvoted. Oct 26, 2012 at 14:40
3

Because I like to be thorough, we ought to consider the fact that border-radius can accept multiple values to describe all four corners individually:

$('*').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/

That said, filtering EVERY element on the page is outrageously inefficient. The better approach is just to assign the border-radius to a class and test for the existence of objects with that class.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.