1、Style物件

style物件代表一個單獨的樣式宣告，可以從應用樣式的文件元素訪問Style物件。style物件獲取的是內http://www.cppcns.com聯樣式，即元素標籤中style屬性的值。

例子：

<style type="text/">#div{color:gray;}</div>//內www.cppcns.com部樣式
<div id="div" style="color:red;"></div>//內聯樣式
document.getElementById('id').style.color;//值為red

2、currentStyle物件

返回所有樣式宣告（包括內部、外部、內聯）按css層疊規則作用於元素的最終樣式。只有IE和Opera支援使用CurrentStyle獲取的元素計算後的樣式。getComputeStyle()方法可以獲取當前元素所使用的css屬性值。

var div=window.getComputeStyle("div",null).color;//第一個引數為目標元素，第二個引數為偽類（必需，沒有偽類設為null）

與style物件的區別：

getComputeStyle()是隻讀，IabLeCMcWg只能獲取不能設定，style能讀能設；

對於一個沒有設定任何樣式的元素，getComputedStyle()返回物件中的length屬性值，而style物件中length是0。

不同的瀏覽器對currentStyle物件支援有差異，需要相容處理。

var div=document.getElementById('div');

var colorStr=null;

if(div.currentStyle){//相容IE

       colorStr=div.currentStyle;

}else{
colorStr=window.getComputedStyle(div,null);

}

var col=colorStr.color;//得到div的color屬性值

3、例子（可拖動的層）

currentstyle物件

style物件

到此這篇關於 style物件與CurrentStyle物件案例詳解的文章就介紹到這了,更多相關 style物件與CurrentStyle物件內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援我們！