CODEWITHSUNDEEP
htmlinternet-explorerdom
Franck Freiburger
Franck Freiburger

Reputation: 28428

style attribute issue with Internet Explorer

In the following example, how to get the value of the style attribute using DOM api:

<!DOCTYPE html>
...
<div id="myid" style="foo"></div>
...

document.getElementById('myid').getAttribute('style') returns "foo" on firefox and google chrome but returns null on IE(9)

Upvotes: 1

Views: 1155

Answers (1)

Jukka K. Korpela
Jukka K. Korpela

Reputation: 201538

IE parses the style sheet and discards syntactically malformed parts. If you test with e.g. <div id="myid" style="color: #003; foo; line-height: 1.3"> then IE 9 Standards Mode returns color: rgb(0, 0, 51); line-height: 1.3;. So it has converted the color notation, and it has discarded the malformed part. In your case, the CSS code becomes empty after removing the bad part.

Older versions of IE behave differently, and so does IE 9 in Quirks Mode. As a rule, avoid reading the style HTML attribute, and read the style DOM property instead. Regarding the difference, see question Different ways of accessing attribute values using javascript.

Upvotes: 2

Related Questions