How to check if HTML style attribute exists with javascript

The style object has a length property which tells you if the element has any inline styles or not. This also avoids the problem of having the attribute style being present but empty.

// Would be 0 if no styles are applied and > 0 if there are inline styles applied
contentWrapper.style.length
// So you can check for it like this
contentWrapper.style.length === 0

if(!contentWrapper.getAttribute("style"))

OR

if(contentWrapper.getAttribute("style")==null || 
   contentWrapper.getAttribute("style")=="")    

the above lines will work for you (anyone can be chosen).

In second solution:

first check watches if style attribute is present in the element, 2nd check ensures that style attribute is not present as an empty string e.g. <div id="contentWrapper" style="">

Complete code is given below:

var contentWrapper = document.getElementById("contentWrapper");
if(contentWrapper.getAttribute("style")==null || contentWrapper.getAttribute("style")=="")
alert("Empty");
else
alert("Not Empty");

http://jsfiddle.net/mastermindw/fjuZW/ (1st Solution)

http://jsfiddle.net/mastermindw/fjuZW/1/ (2nd Solution)


if(contentWrapper.getAttribute("style")){
    if(contentWrapper.getAttribute("style").indexOf("display:") != -1){
        alert("Not Empty");
    } else {
        alert("Empty");
    }
}