currentStyle

用js的style属性可以获得html标签的样式,但是不能获取非行间样式。

解决方法:

在IE下可以用currentStyle;

在FF下用getComputedStyle;

然而,为了让其兼容,解决方法,封装成getStyle事件:

<!DOCTYPE html><html lang="en"><head>   <meta charset="UTF-8">   <title>Title</title>   <style>      #div2{width:500px;height:100px;background-color:green;}   </style></head><body><div id="div2"></div></body></html><script>最初:
if(oDiv2.currentStyle){ //IE console.log(oDiv2.currentStyle.height);}else{ //    FF console.log(getComputedStyle(oDiv2,false).width);}
   //封装一个兼容性的获取元素样式的函数   //分析:哪个元素,哪个样式   function getStyle(obj,attr){      if(obj.currentStyle){      //IE         return obj.currentStyle[attr];      }else{      //FF         return getComputedStyle(obj,false)[attr];      }   }//用法   window.onload = function(){      var oDiv=document.getElementById("div2");      console.log(getStyle(oDiv,"width"));   }

//进一步封装 

//obj:获取谁的样式,attr:样式名称,value样式的值
function css(obj,attr,value){   if(arguments.length==2){//获取      return getStyle(obj,attr)   }else if(arguments.length == 3){//设置      obj.style[attr] =value;   }}
//用法:
//      oBtn.onclick = function () {//        css(oDiv,"background","black");//        css(oDiv,"border","3px solid yellow");//        console.log(css(oDiv,"width"));//     }
</script>

补充:JavaScript中,函数本身的length属性和arguments.length到底有什么区别?1,函数本身有length属性,表示参数的个数。arguments.length也表示参数的个数。

2,函数对象的length属性是形式参数的个数;arguments伪变量的length属性是某次调用的实际参数的个数。  例如:    function func(a,b,c){
       console.log(arguments.length);//输出:3    }

      console.log(func.length)//输出: 1

    func(1);3,函数本身也是对象,对象就有属性,函数有length属性,比如: function fn(x,y,z) {}中 fn.length=3,说明了函数的形参个数; 而在函数体内,arguments.length表示传入函数的实参个数,比如:function fun(1,2) { console.log(arguments.length)} 中实参的个数为arguments.length=2

4,fn.length: 形参个数arguments.length: 实参个数

//拓展:
//arguments  数组(所有的参数)  可变参(不定参)function sum2() {   var result = 0;   var i = 0;   for(i=0;i<arguments.length;i++){      result += arguments[i];   }   console.log(result);//输出13

}sum2(4,4,5);

 总结,除了可以用arguments去判断参数个数,还可以做不定参的运算。

    
				
时间: 2024-08-24 08:10:49

currentStyle的相关文章

拿到内存中dom元素的最后样式进行修改obj下的currentStyle方法

在用dom操作在对页面中的<style></style>里的样式进行操作时,发现时无效的,我觉得是因为页面DOM解析时此标签的样式内容才会被读到内存中,因此JS操作时取不到此标签的内容 一个标签的样式有可能是多个样式文件所定义而成了,所以浏览器在解释标签的时候会有一个计算标签最后样式的过程,想要对<style>中定义格式的标签的样式进行修改必须去操作最后浏览器计算机计算出的样式,这里用obj下的currentStyle方法,具体测试如下: <html> &l

getComputedStyle与currentStyle获取样式(style/class)

大家都知道,用document.getElementById(‘element').style.xxx可以获取元素的样式信息,可是它获取的只是DOM元素style属性里的样式规则,对于通过class属性引用的外部样式表,就拿不到我们要的信息了. DOM标准里有个全局方法getComputedStyle,可以获取到当前对象样式规则信息,如:getComputedStyle(obj,null).paddingLeft,就能获取到对象的左内边距.但是事情还没完,万恶的IE不支持此方法,它有自己的一个实

【笔记】归纳js getcomputedStyle, currentStyle 以及其相关用法

  好吧,鉴于前端则个行业知识宽度广而深,早期看过高程介绍过的获取元素计算后的最终样式(浏览器显示的最终样式)的方法现在也忘得七七八八了 于是百度了一下,看了一下大神张鑫旭的博客,这里写个随笔记录一下,留作记录 获取元素的样式,我们平常用得最多的方法是 elem.style.xxx属性,此属性既可都又可写,但!它只能获取元素的内嵌样式,所以要获取一个元素的真正样式并不能通过这个方法获取,于是有了下面两个方法: getComputedStyle : (现代浏览器以及ie9+ 的浏览器适用) 1.此

js用currentStyle和getComputedStyle获取css样式(非行间) 兼容ie与火狐

用js的style属性可以获得html标签的样式,但是不能获取非行间样式.那么怎么用js获取css的非行间样式呢?在IE下可以用currentStyle,而在火狐下面我们需要用到getComputedStyle.下面是js代码. function getStyle(obj, name) { if(obj.currentStyle) { return obj.currentStyle[name]; } else { return getComputedStyle(obj,false)[name];

currentstyle 和 getComputedStyle—JS学习笔记2015-6-17(第59天)

getComputedStyle 和 currentStyle 获得到的是计算机(浏览器)计算后的样子: ie8 以及更早ie浏览器,无法兼容该方法: 可以使用currentStyle  // 不过标准浏览器下却不兼容: 这两种方法的适用范围和注意事项(以后会有解决方案,比如正则, 学东西不要死板): 复合样式获取不到,会有兼容性问题,比如:background 想到得到背景颜色, 应该是backgroundColor 获取单一样式,而不要获取复合样式 不要有空格: 不要获取未设置后的样式:不兼

arguments | json | currentStyle

arguments |  json | currentStylefor( var i in json); 获取非行间样式,在IE下用 currentStyle(IE-9) ,在chrome 和 firfox 下用 getComputedStyle. 其中判断IE还是chrome.firfox是根据 obj.currentStyle ,ie为ture,FF为false. 获取非行间样式        window.onload=function(){            var oDiv2 =

getComputedStyle和currentStyle

1 /*alert(div.style.width)*/ //null 2 3 function getstyle(obj,name){ 4 if(obj.currentStyle) { 5 return obj.currentStyle[name]; 6 } else { 7 return getComputedStyle(obj,null)[name]; 8 } 9 } 10 alert(getstyle(div,'width')) 11 } 兼容ie 和非ie浏览器的获取样式写法 : zI

style、currentStyle、getComputedStyle区别介绍

样式表有三种方式 内嵌样式(inline Style) :是写在Tag里面的,内嵌样式只对所有的Tag有效. 内部样式(internal Style Sheet):是写在HTML的里面的,内部样式只对所在的网页有效. 外部样式表(External Style Sheet):指引入以.css为后缀的CSS文件,.最常用的是style属性,即在JavaScript中,通过document.getElementById(id).style.XXX就可以获取到 XXX的值,但意外的是,这样做只能取到通过

getComputedStyle currentStyle 获取当前元素所有最终使用的CSS属性值

object.getComputedStyle  获取当前元素所有最终使用的CSS属性值.返回的是一个CSS样式声明对象,只读,不能设置. 此方法不兼容IE8及以下,需用currentStyle方法. function getStyle(obj.attr){ return getComputedStyle(obj)?getComputedStyle(obj)[attr]:obj.currentStyle[attr]; //判断是否有getComputedStyle方法 } obj为需要获取属性值

JavaScript中style, currentStyle和 getComputedStyle的异同

今天在做项目的时候,习惯性的用到了element.style.width,然而浏览器却报错,错误提示是style is undefined,这是我才意识到,内联样式表和外联样式表在js应用中也有很大的不同! 首先样式表有三种,外联样式,内联样式,行间样式,element.style.attr只有在attr定义在行间样式时才生效,因此替代方案,currentStyle和getComputedStyle出现了. currentStyle是由微软提出来的,目的就是为了返回当前元素应用的属性,不管是外联