JavaScript中如何获取属性&封装函数

第一种方法

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]