Firefox無法枚舉document.styleSheets []。cssRules []

Question

這是代碼：

• http://jsfiddle.net/salman/2hyYg/
• http://jsfiddle.net/salman/2hyYg/show/

您會注意到alert(document.styleSheets[x].cssRules.length)因“安全異常”而失敗。 任何解決方法。 我問，因為有一些“CSS延遲加載”類使用此功能來檢測是否加載了CSS文檔。

另外：安全例外是正確的行為/是否符合標准？

Answer 1

嘗試讀取從其他域或服務器加載的樣式表或嘗試讀取@import規則時，您可能會收到該錯誤。

為了您的目的，只需檢查document.styleSheets.length。

Answer 2

截至2013年，您可以在<link> -Element上設置“crossorigin”屬性，以通知瀏覽器此CSS受信任（ https://developer.mozilla.org/en-US/docs/Web/HTML/Element /鏈接 ）。

之后，您可以通過Javascript訪問其規則。

Answer 3

你正在從另一個域加載css文件，我想你不能修改外部加載的css文件的cssRules。

請參閱： 使用.cssRules訪問跨域樣式表

Answer 4

嘗試條件：（IE解決方法）

function aftermath(index) {
    var css = document.styleSheets[index].rules || document.styleSheets[index].cssRules;
    alert(css.length);
}

這是錯誤的：

aftermath(document.styleSheets.length - 1);

如果我把它設置為0都可以正常工作......問題是css目前還沒有准備好，如果你需要訪問它，你需要在第二時刻這樣做

最后編輯：

如果您要從源代碼更新css，可以使用php代理加載它：

<?php
$name = 'http://ajax.googleapis.com/ajax/libs/jqueryui/$_GET[version]/themes/$_GET[theme]/jquery-ui.css';
$fp = fopen($name, 'rb');
fpassthru($fp);
exit;
?>

然后你可以使用例如/proxy.php?version=1.7.0&theme=humanity來獲取它

Answer 5

樣式表在那里工作正常，您無法訪問樣式表的cssRules屬性，因為瀏覽器將其設置為null。

您獲得的安全性錯誤是由於相同的源策略 - 您正在處理來自其他域的樣式表，如果樣式表托管在您的網頁所在的域中，則不會出現此問題。

Answer 6

您可以將失敗的行放在try-catch塊中。 這就是我在一個項目中解決同樣問題的方法。

Answer 7

嘗試使用window.document.styleSheets[x].cssRules.length而不是document.styleSheets[x].cssRules.length 。 它將在Firefox上運行，沒有任何安全性異常。