獲取所有CSS樣式屬性？

我想通過JavaScript訪問所有的CSS屬性（不僅僅是一個特定的選擇器或元素，而是所有的）。獲取所有CSS樣式屬性？

我想遍歷.style集合的所有屬性。

我該怎麼做？

來源

2012-04-28 gaurav

由*所有*，你的意思是所有元素的所有CSS？ – Joseph 2012-04-28 05:46:22

你是什麼意思？您必須先選取一個元素，然後才能訪問其屬性。 – Sampson 2012-04-28 05:46:26

通過所有的手段所有CSS樣式，如風格[「a」]風格[「z」]和style.length =總css屬性，我們可以應用於任何元素。 – gaurav 2012-04-28 05:49:17

您可以使用CSSStyleDeclaration object。 CSSStyleDeclaration對象可通過JavaScript屬性提供CSS樣式屬性。這些JavaScript屬性的名稱與CSS屬性名稱非常接近。

該對象具有兩個附加屬性：

cssText
一套風格屬性和屬性值的的文本表示。文本格式與CSS樣式表一樣，減去元素選擇器和圍繞屬性和值的大括號。

長度
此CSSStyleDeclaration中包含的屬性/值對的數量。 CSSStyleDeclaration對象也是一個類似數組的對象，其元素是聲明的CSS樣式屬性的名稱。

https://developer.mozilla.org/en/DOM/CSSStyleDeclaration
https://developer.mozilla.org/en/DOM/CSS

來源

2012-04-28 06:14:30 undefined

你可以看到如何從javascript訪問樣式表：http://www.quirksmode.org/dom/changess.html。

IE與其他瀏覽器的不同之處在於，讓所有跨瀏覽器的東西正確無誤是一件痛苦的事情。

var theRules = new Array(); 
if (document.styleSheets[1].cssRules) 
    theRules = document.styleSheets[1].cssRules 
else if (document.styleSheets[1].rules) 
    theRules = document.styleSheets[1].rules

通常情況下，你可以預先定義幾個CSS規則，然後從不同的對象，以更改應用的樣式添加或刪除類。

來源

2012-04-28 06:02:31 jfriend00

感謝回答，我想我無法清楚地解釋我的要求，好的，讓我再試一次，在css3中有多少財產，我不知道確切的數量，但我想訪問它從javascript的所有內容 – gaurav 2012-04-28 06:11:30

//to loop through the available css properties using jQuery 
$(document).ready(function() { 
    availableProps = getComputedStyle(document.body); 
    $.each(availableProps, function(propCount, cssProp) { 
     console.log('CSS Property : ' + cssProp); 
    }); 
});

來源

2016-06-04 23:48:56

這是真正的*訪問*？另外，OP要求迭代這些屬性。你可以將這些信息添加到你的答案？ – dakab 2016-06-05 07:42:56

ahh謝謝我沒有注意到他需要訪問。更新了我的答案。 – 2016-06-19 01:03:07

獲取所有CSS樣式屬性？

回答

相關問題