I have the following javascript function which works fine in Chrome, but fails in all other browsers.
function myFunction(a) {
var sheets = document.styleSheets, o = {};
for (var i in sheets) {
var rules = sheets[i].rules || sheets[i].cssRules;
for (var r in rules) {
if (a.is(rules[r].selectorText)) {
o = $.extend(o, css2json(rules[r].style), css2json(a.attr('style')));
}
}
}
return o;
}
In safari it appears to be the if statement that causing the problem giving the following error:
Syntax error, unrecognized expression: input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button
But in firefox it is the declaration of the rules variable where it breaks (giving a The operation is insecure.
message).
Any ideas what the problem might be or how to fix it?
EDIT
If it matters, here's the css2json function:
function css2json(css) {
var s = {};
if (!css) return s;
if (css instanceof CSSStyleDeclaration) {
for (var i in css) {
if ((css[i]).toLowerCase) {
s[(css[i]).toLowerCase()] = (css[css[i]]);
}
}
} else if (typeof css == "string") {
css = css.split("; ");
for (var i in css) {
var l = css[i].split(": ");
s[l[0].toLowerCase()] = (l[1]);
}
}
return s;
}
EDIT
I've fixed the firefox bug by ignoring externally linked stylesheets.
Still not got it working in Safari though.