jQuery $.parseHTML() does not seem to be identifying the style attribute when the attribute's value represents invalid CSS.
Here is sample code:
jQuery(document).ready(function()
{
var TestStringCSSValid = '<div style="width: 80px;"><p>hello world</p></div>';
var TestStringCSSInvalid = '<div style="invalidcss"><p>hello world</p></div>';
/*var ElementNodeList = $.parseHTML(TestStringCSSValid);*/
var ElementNodeList = $.parseHTML(TestStringCSSInvalid);
$.each(ElementNodeList, function(i, element)
{
ItemizeElements(element);
});
function ItemizeElements(element)
{
alert(element.nodeName.toLowerCase());
if (element.attributes != null)
{
$.each(element.attributes, function(i, attribute)
{
alert(element.nodeName.toLowerCase() + " " + attribute.name.toLowerCase());
});
}
var ChildNodeList = element.childNodes;
$.each(ChildNodeList, function(i, child)
{
ItemizeElements(child);
});
}
});
When the first test string is parsed (commented out code) all five major browsers (IE9 and most recent versions of FF, Chrome, Opera, and Safari for PC) produce the expected series of alerts:
-div
-div style
-p
-#text
When the second string is parsed (code as shown) all but IE continue to show the same series. IE9 shows only the div, p, and #text. It is not detecting that the div has the style attribute. The code shown here is a simplification of more extensive code with deeper hierarchies, where the problem also appears.
Is this a known bug in IE, or in jQuery? What can be done about it?
Thanks for your help.
