JS---获取元素计算后的样式属性值 (getComputedStyle)---兼容函数
程序员文章站
2023-03-26 19:23:07
获取计算后的样式属性 获取一个元素任意一个样式属性值 获取元素距离左边位置的值 会有如下兼容性问题: my$("btn").onclick = function () { //获取元素距离左边位置的值 console.log(my$("dv").offsetLeft); //谷歌,火狐支持 //co ......
获取计算后的样式属性----获取一个元素任意一个样式属性值
获取元素距离左边位置的值
会有如下兼容性问题:
my$("btn").onclick = function () { //获取元素距离左边位置的值 console.log(my$("dv").offsetleft); //谷歌,火狐支持 //console.log(window.getcomputedstyle(my$("dv"),null).left); //console.log(window.getcomputedstyle(my$("dv"),null)["left"]); //ie8支持 //console.log(my$("dv").currentstyle.left); };
获取任意一个元素的任意一个样式属性的值
因此封装一个兼容函数,判断浏览器是否支持再返回
//获取任意一个元素的任意一个样式属性的值
function getstyle(element, attr) { //判断浏览器是否支持这个方法 return window.getcomputedstyle ? window.getcomputedstyle(element, null)[attr] : element.currentstyle[attr]; }
测试:
//测试 my$("btn").onclick = function () { console.log(getstyle(my$("dv"), "top")); };