原生js获取元素非行内样式属性的方法

获取当前对象的样式DOM标准中的全局方法 getComputedStyle(obj).width （获取元素的宽度）,但在非标准IE浏览器（IE8）以下有兼容问题
IE8以下要这样写 obj.currentStyle.width 这样的话在IE8以下正常显示，但标准浏览器下又会报错，所以一要判断一下

//getStyle()函数，获取元素的非行内样式
//使用方法 getStyle(元素,"属性名")  如：getStyle(oBox,"background")
function getStyle(obj,attr) {if(window.getComputedStyle){//浏览器如果支持getComputedStyle()方法return getComputedStyle(obj)[attr];}else{return obj.currentStyle[attr];}
}

obj.style.width只能获取行内元素样式

<head><style>.block{width: 100px;height: 100px;}</style>
</head><body><div class="block" style="background:blueviolet;"></div><script>var block = document.getElementsByClassName("block")[0];    　console.log(block.style.width);//什么都不输出

　　　　console.log(block.style.background);//blueviolet

　　</script>
</body>
</html>

转载于:https://www.cnblogs.com/wuyufei/p/10461857.html

原生js获取元素非行内样式属性的方法相关推荐

原生js获取元素并设置样式
下面我是通过class获取元素 <!DOCTYPE html> <html lang="en"><head><meta charset=& ...
原生js获取元素高度
原生js获取元素高度 <div id='container'></div> let dom = document.getElementById('contanier')dom. ...
js获取classname值_利用js获取元素class值的两种方法
我们有时为了达到某种效果,需要以元素的class值为条件做判断. 我们如何利用JavaScript获取元素class的值?我们先看下面代码: x=document.getElementsByTagNa ...
怎么修改html行内样式表,原生JS获取及设置CSS样式-1.行内样式
面试中,应该会经常被问到样式的写法以及如何使用原生JS获取及操作样式的问题吧,让我给大家总结一下~ HTML中样式的写法不外乎以下四种方式行内样式假装有内容 head内部样式 div { widt ...
原生js获取html元素高度,原生JS获取元素宽高实践详解
开篇的话任何不是亲身实践中求得的知识,都不是属于你的. 任何求得的知识不去时常温习运用,也不是属于你的. 记录由来在做个上拉广告功能中遇到了一个"理所当然"觉得对的用法,慢慢才 ...
通过js获取元素css3的transform rotate旋转角度方法
我们再试用jquery获取样式的时候是通过$('domName').css('transform'):的方式来获取元素的css样式,但是通过它获取到的css3的transform属性是以矩阵的方式呈现 ...
原生JS获取元素属性值
方法一第一步我们要获取到元素(比如用ID),不可以是类数组(比如用class),类数组除了有一些数组的基本特征不可以使用其他方法,你会报错的第二步目标元素必须设置position为absolu ...
js获取元素的left和top值方法总结
方法一: 使用obj.style.left和obj.style.top 该方法获取到的样式可读可写但是这种方法有局限性,仅能获取行内样式中的left,right. 如果写在了style标签里,或者l ...
原生js获取元素的子元素
//使用firstChild //但是下面这种因为有空格,也算其子元素<lable><span id="onlinePerson" name="pers ...
JS 获取元素当前的样式信息
1 HTMLElement.prototype.__defineGetter__("currentStyle", function () { 2 return this.owner ...

原生js获取元素非行内样式属性的方法

原生js获取元素非行内样式属性的方法相关推荐

最新文章

热门文章