jQuery check if element has css attribute

Question

I need to know when I click on an element if this element has a CSS attribute. I am thinking of something like this, but it does not work:

if ($('#element').attr("text-shadow")) {
    alert ('i Have')
}
else {
    alert ('i dont')
}

Any tips on this one? Thanx

score 29 · Accepted Answer · edited Apr 21 '10 at 18:58

29

if( $('#element').css('text-shadow') != null )  { 
    /*success*/ 
} 
else { 
    /*does not have*/ 
}

edited Apr 21 '10 at 18:58

Robert Harvey

answered Apr 21 '10 at 18:56

Stefan Kendall

for some reason this does not work. There must be something wrong with my code. – Mircea Apr 21 '10 at 19:06
It works for me with 1.4.2. Which version of jQuery are you using. Which browser? Can you provide a sample .html page and host it somewhere so I can debug the issue and see what's going on? – Stefan Kendall Apr 21 '10 at 19:24
@Bears: Maybe, but in this specific instance, the two should be equivalent, and your solution is an extra non-compressable byte :P. – Stefan Kendall Apr 21 '10 at 19:25
Sorry it was a browser thing. i restart it and works now. Thanx. – Mircea Apr 21 '10 at 19:30
Would this work if I needed to check a certain attribute's current value (example >> left: 0)? – Tyler Lazenby Jun 24 '15 at 22:21

yuliskov · Answer 2 · 2016-01-08T01:07:42.387

3

In case you want to test 'width' style property. Behavior in Firefox is slightly differ from other browsers.

if (jQuery(value).css('width') == '0px') { // width not set
    jQuery(value).css('width', '320px');
}

edited Jan 08 '16 at 01:07

answered Jan 07 '16 at 14:44

yuliskov

score 2 · Answer 3 · answered Apr 21 '10 at 19:01

2

How about this instead:

if($('#element').css('text-shadow') == null) ...

answered Apr 21 '10 at 19:01

Jimmy Baker

Yes, thank you. I opened this question before any answers had been posted then stepped away from my desk for a moment. My apologies. – Jimmy Baker Apr 21 '10 at 19:09

score 1 · Answer 4 · answered Apr 21 '10 at 18:56

1

$('#element').css("text-shadow")

answered Apr 21 '10 at 18:56

prendio2

score 1 · Answer 5 · edited Mar 16 '18 at 08:14

1

How about this

if ($('#element')[0].style.text-shadow != '') {
    alert ('i Have')
}
else {
    alert ('i dont')
}

edited Mar 16 '18 at 08:14

Lucifer

answered Mar 16 '18 at 08:13

Khanh Huynh

5 Answers5