javascript - 无法获取属性值 'indexOf'

Question

我正在使用 CSS 多列布局 (css3)，当然它在 Chrome、FF 和 Safari 中工作得很好。 但许多人仍然使用 IE9，我们有支持它的要求。

对于 IE 支持，我包含来自 this site 的 csscolumns polyfill js .

当这个 polyfill 在 IE9 中加载时，我在控制台中收到此错误消息:

'unable to get value of the property 'indexof' object is null or undefined'

调试器会将此代码突出显示为问题源:

function loadCssCache(s,callback){if(s.href.indexOf(location.host)==-1||s.href.indexOf(location.host)>50){return false}

调用loadCssCache的代码是:

for (var i = 0; i < document.styleSheets.length; i++) {
    loadCssCache(document.styleSheets[i], "parseStylesheets")
}

s.href.indexOf 是失败的地方。还有其他人遇到过这个问题吗？或者可能知道问题是什么？

Answer 1

spec似乎表明内联样式表(style 属性中包含的内容)包含在 document.styleSheets 列表中。相关部分大概是这样的:

For inline style sheets, the value of this attribute is null.

因此，如果任何元素上有任何样式属性，则在尝试读取 .href 的值时将会收到空引用错误。

一个简单的修复方法是添加对 null 的检查:

function loadCssCache(s,callback){
    if(s.href == null || s.href.indexOf(location.host) == -1 || s.href.indexOf(location.host) > 50){
        return false
    }
}