頁面中用了style特性的元素CSS樣式，并沒有通過直接寫在對象里面的style定義，這樣的CSS怎么通過javascript的dom訪問呢。也就是說怎么通過javascript Dom來訪問CSS類中的屬性。
首先，獲得定義樣式表CSS的引用。使用的是document.styleSheets集合實現(xiàn)的。Dom指定樣式表對象有以下特性
1.disabled-表示樣式表是否被禁用
2.href-用于外部引用文件樣式表的url，對于style元素的話，該值應該是null,不過在Mozilla返回的是當前頁面的url值
3.media-可以使用該樣式表的媒體類型,由html的media特性指定,IE在實現(xiàn)這個屬性上有錯誤，返回的是與media特性包含相同內(nèi)容的字符串。、
4.ownerNode-指定樣式的DOm節(jié)點。IE不支持該屬性
5.parentStyleSheet-如果樣式表是通過CSS的@import語句來加載的，哪么這個特性將指出，出現(xiàn)@import語句的樣式表。
6.title-通過HTML title特性非配給樣式表的標題，可以用在<link/><style/>上。
7.type-樣式的mime類型，對于CSS通常是text/css.
應為瀏覽器不同,訪問樣式表中單獨的規(guī)則也是有技巧的.dom為每一個樣式表指定了一個cssRules的集合,它包含所有的定義在樣式表中的CSS的規(guī)則?；鸷麺ozilla和蘋果的Safari正確的實現(xiàn)了該標準,不過IE是通過rules.因此要檢查一下，該使用那個。
舉例:
var obj_css = document.styleSheets[0].cssRules ||document.styleSHeets[0].rules;
頁面舉例:
<html>
<head>
<title>網(wǎng)站制作學習網(wǎng)-http://www.forasp.cn</title>
<style type="text/css">
.foraspcn {background-color:red;height:28px;width:200px;margin:1px;}
</style>
<script language="javascript">
function show_bgcolor()
{
var obj_css = document.styleSheets[0].cssRules ||document.styleSheets[0].rules;//返回的是一個集合對象
alert(obj_css[0].style.backgroundColor);//輸出red
}
</script>
</head>
<body>
<div class="foraspcn"><a href="javascript:void(0);" onclick="show_bgcolor();">點擊查看顏色屬性</a></div>
</body>
</html>
更多信息請查看IT技術專欄
公眾號
事業(yè)單位
當前位置：
公考類
招聘類
各類考試