如何检查变量或属性在 JavaScript 中是否可读

Question

我想遍历文档样式表并遍历每个样式表的规则。

我正在执行以下操作：

var sheets = typeof sheet !== "undefined" ? [sheet] : document.styleSheets;
for (var i = 0, l = sheets.length; i < l; i++) {
    sheet = sheets[i];
    if (typeof sheet.cssRules === 'undefined' || !sheet.cssRules) {
        continue;
    }
    for (var j = 0, k = sheet.cssRules.length; j < k; j++) {
        var rule = sheet.cssRules[j];
        //some code
    }
}

问题是其中一个文档样式表是从谷歌地图API动态加载的。因此，以下行失败并给出跨域安全错误，指出 cssRules 不是可读属性：

if (typeof sheet.cssRules === "undefined" || !sheet.cssRules) {

有没有办法检查cssRules是否可读？我只想跳过错误并继续下一个样式表。

这在 Opera 12.17 和 Firefox（开发者版）中失败了

Answer 1

你可以

这样做：

var classes = document.styleSheets[0].rules || document.styleSheets[0].cssRules;
    for (var x = 0; x < classes.length; x++) {
    }

Answer 2

我找到了一个可行的解决方案。我只是使用了一个尝试捕获块。

因此，以下代码有效：

var sheets = typeof sheet !== "undefined" ? [sheet] : document.styleSheets;
for (var i = 0, l = sheets.length; i < l; i++) {
    sheet = sheets[i];
    try {
        if (typeof sheet.cssRules === "undefined" || !sheet.cssRules) {
            continue;
        }
    }
    catch (err) {
        continue;
    }
    for (var j = 0, k = sheet.cssRules.length; j < k; j++) {
        var rule = sheet.cssRules[j];
        //some code
    }
}

这样，在 Opera 中没有错误，并且在 Firefox 中捕获异常，因此脚本不会停止运行。

Answer 3

如果您想通过避免其他域样式表来避免交叉浏览问题。 您可以根据需要添加以下条件。

            // get current site url
            function get_hostname(url) {
            var m = url.match(/^http://[^/]+/);
            return m ? m[0] : null;
            }
            // your stylesheet loop add one more condition in if statement. 
            var sheets = typeof sheet !== "undefined" ? [sheet] : document.styleSheets;
            for (var i = 0, l = sheets.length; i < l; i++) {
            sheet = sheets[i];
            if (typeof sheet.cssRules === 'undefined' || !sheet.cssRules || location.origin != get_hostname(sheet.href)) {
            continue;
            }
            for (var j = 0, k = sheet.cssRules.length; j < k; j++) {
            var rule = sheet.cssRules[j];
            //some code
            }
            }