currentStyle

currentStyle用js的style属性可以获得html标签的样式,但是不能获取非行间样式。解决方法:在IE下可以用currentStyle;在FF下用getComputedStyle;然而,为了让其兼容,解决

大家好,又见面了,我是你们的朋友全栈君。

用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);
以上是后来发现错的,2017-03-16更正了以后:
      function func(a,b,c){
       console.log("arguments:"+arguments.length); //输出 arguments::1
    }
    console.log("length:"+func.length); //输出 length: 3
    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去判断参数个数,还可以做不定参的运算。
    


版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/154507.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 登录页面的代码

    登录页面的代码开发工具与关键技术:MVC/JavaScript作者:邱慧敏撰写时间:2019/06/25在把页面和数据库做好之后,我的登录页面只需要用户名和密码,所以代码比较简单。先找到登录按钮,给一个点击事件,然后再获取他们的表单值,然后对用户名和密码进行判断,判断是否填写了资料和是否是正确的账户和密码,在这之前还要检查登录页面是否是属于外层页面。dataValidationFo…

    2022年4月4日
    51
  • Java安全之初探weblogic T3协议漏洞

    Java安全之初探weblogicT3协议漏洞文章首发自安全客:Java安全之初探weblogicT3协议漏洞0x00前言在反序列化漏洞里面就经典的还是莫过于weblogic的反序列化漏洞

    2021年12月12日
    46
  • Django(61)认证组件源码分析

    Django(61)认证组件源码分析认证组件源码入口APIView下的dispatch下的self.initial(request,*args,**kwargs),源码如下:definitial(self,request,

    2022年7月31日
    7
  • ribbon自定义负载均衡策略,应用所有服务_dubbo的负载均衡策略

    ribbon自定义负载均衡策略,应用所有服务_dubbo的负载均衡策略Ribbon默认的负载均衡策略默认的有下面几种:我们也可以自定义负载均衡策略:修改springcloud-consumer-dept-80的主启动类:下面开始编写自定义配置类MySelfRule,但这个类不能乱放!官方文档给出警告:这个自定义的类不能放在@ComponentScan所扫描的当前包以及子包下,否则我们自定义的这个配置类就会被所有的Ribbon客户端所共享,也就是我们达…

    2022年10月13日
    0
  • List去除重复数据的五种方式

    点击上方“全栈程序员社区”,星标公众号 重磅干货,第一时间送达 作者:多纤果冻 blog.csdn.net/qq_37939251/article/details/90713643…

    2021年6月27日
    74
  • 学习笔记——在vue中如何配置Jest(一)

    最近在搞Jest单元测试,如何在vue中安装和使用jest我就不说了,前一篇文章简单的说了一下在使用jest时遇到的一些问题,但是我觉得并没有真正的解决的很好。后面会在学习过程中更新前面的那篇文章,加

    2022年3月25日
    42

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号