這個element.style屬性只讓您知道定義為內聯在該元素(以編程方式或在元素的樣式屬性中定義)中，您應該獲得計算樣式.

用跨瀏覽器的方式做它并不容易，IE有自己的方式，通過element.currentStyle屬性，以及DOM級別2。標準方法，由其他瀏覽器通過document.defaultView.getComputedStyle方法。

這兩種方式有不同，例如IEelement.currentStyle中的兩個或多個單詞組成的ccs屬性名稱。CamelCase(如：maxHeight,?fontSize,?backgroundColor等等，標準的方式期望屬性用虛線分隔的單詞(例如。max-height,?font-size,?background-color(等)

同時，IEelement.currentStyle將返回它們指定的單位中的所有大小(例如12pt、50%、5em)，標準方法總是計算實際大小(以像素為單位)。

不久前，我創建了一個跨瀏覽器函數，允許您以跨瀏覽器的方式獲取計算樣式：function?getStyle(el,?styleProp)?{

var?value,?defaultView?=?(el.ownerDocument?||?document).defaultView;

//?W3C?standard?way:

if?(defaultView?&&?defaultView.getComputedStyle)?{

//?sanitize?property?name?to?css?notation

//?(hypen?separated?words?eg.?font-Size)

styleProp?=?styleProp.replace(/([A-Z])/g,?"-$1").toLowerCase();

return?defaultView.getComputedStyle(el,?null).getPropertyValue(styleProp);

}?else?if?(el.currentStyle)?{?//?IE

//?sanitize?property?name?to?camelCase

styleProp?=?styleProp.replace(/\-(\w)/g,?function(str,?letter)?{

return?letter.toUpperCase();

});

value?=?el.currentStyle[styleProp];

//?convert?other?units?to?pixels?on?IE

if?(/^\d+(em|pt|%|ex)?$/i.test(value))?{

return?(function(value)?{

var?oldLeft?=?el.style.left,?oldRsLeft?=?el.runtimeStyle.left;

el.runtimeStyle.left?=?el.currentStyle.left;

el.style.left?=?value?||?0;

value?=?el.style.pixelLeft?+?"px";

el.style.left?=?oldLeft;

el.runtimeStyle.left?=?oldRsLeft;

return?value;

})(value);

}

return?value;

}}

上面的函數在某些情況下并不完美，例如對于顏色，標準方法將在RGB(.)表示法，在IE上，它們將按定義返回它們。

我目前正在寫一篇關于這個主題的文章，您可以跟蹤我對這個函數所做的更改。這里.

總結

以上是生活随笔為你收集整理的html页面取js里面的值,如何在javascript中获取HTML元素的样式值？的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。