用JavaScript/jQuery检查.css样式表的名称

Question

我正在尝试制作一个适用于论坛的Chrome浏览器扩展程序，但我只想让它在论坛的某个特定区域中运行。

问题是我不能简单地使用"matches": ["subforum"]，因为这个论坛的帖子并没有通过URL来区分它们所属的子论坛。

该子论坛有自己的CSS样式表，所以我想如果我可以快速检查当前样式表是否与subforum.css相匹配，那么它就可以正常工作。

基本上，我只需要检查样式表的名称，如果不可能的话，还要如何准确地检查当前样式表是否包含某个单词或元素或其他内容。

- Wasps

Answer 1

您可以循环遍历样式表本身以及@import规则。

function sheetExists(name){
    var s = document.styleSheets, i = s.length, j = 0;
    while(i-->0){
        if(s[i].href !== null){
            if(s[i].href.indexOf(name) !== -1) return true;
        }
        while(j < s[i].cssRules.length && s[i].cssRules[j].type === 3){
            if(s[i].cssRules[j].href !== null){
                if(s[i].cssRules[j].href.indexOf(name) !== -1) return true;
            }
            j++;
        }
        j = 0;
    }
    return false;
}
sheetExists('subforum.css');

- Paul S.

Answer 2

使用属性包含选择器：

if ($('link[href*="myStylesheet.css"]').length) {
    //stylesheet containing "myStylesheet.css" in the href attribute was found
} else {
    //not found
}

Fiddle

当然，如果您提供完整的确切属性值，也可以使用Attribute Equals Selector。

if ($('link[href="path/To/myStylesheet.css"]').length) {
    //stylesheet with link="myStylesheet.css" found, do stuff
}

代码片段

- Fabrício Matté