jquery find by css attribute

Question

Hi, I need to find an element based on a specific css attribute. the css is applied inline and I can not use a class. Is there anyway to achieve this in jquery?

Answer 1

You could use an attribute selector

For example

$(":radio [style*='regular']")

would return a wrapped set of any input radios that contain 'regular' in the style attribute

Answer 2

Something like:

$('selector').each(function() {
    if($(this).attr('style').indexOf('font-weight') > -1) {
        alert('got my attribute');
    }
});

Answer 3

var ccsStyle="font-weight:bold";
var els = [];
$("*").each(function(){
  var st = $(this).attr("style");
  if(st.indexOf(cssStyle) > -1) els.push(this);
});
//do stuff with els

Answer 4

You could use the attribute flag and use contains if you know the specific format that it's in.

$("[style*='position']")

This would find all the elements that define the position css attribute.

Answer 5

I think you might be able to write a custom jquery selector to do this

for example if you want to do select by certain style attribute , you can do

 jQuery.extend(jQuery.expr[':'], {
    styleEquals: function(a, i, m){
     var styles = $(a).attr("style").split(" ")
     var found = false;
     for (var i = 0; i < styles.length; i++) {
      if (styles[i]===m[3]) {
       found = true;
       break;
      }
     }
     return found;
    }
});

Then it can be used in conjuction with any other selector you can select all input elements with certain style like this

$('input:styleEquals('width=10px')')