第一種方法

1.var demo = document.getElementById("demo");//對象的id名

console.log(demo.style.left);

第二種方法

logStyle("demo", "left");

function logStyle(id, attr) {

var demo = document.getElementById(id);

console.log(demo.style[attr]);//使用[attr]是因為該函數可以獲取多個屬性.

}

第二種方法中的封裝 獲取計算后樣式屬性值的兼容函數

//封裝函數是為了兼容不同的瀏覽器版本

1.

function getStyle(obj, attr) {

if (window.getComputedStyle) {

return window.getComputedStyle(obj, null)[attr];

} else {

return obj.currentStyle[attr];

}

}

2.

function getStyle(obj, attr) {

return obj.currentStyle ? obj.currentStyle[attr] : window.getComputedStyle(obj, null)[attr];

}

獲取計算后樣式的方法 (不僅是行內元素的樣式的方法)

以id名為demo,屬性left為例

window.getComputetedStyle(demo,null).left // 火狐,谷歌,ie9,以上都支持

demo.currentStyle.left? ie6.7.8及新版瀏覽器都支持

難點:attr的存在即書寫方式[attr]