用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去判断参数个数,还可以做不定参的运算。
    
												

currentStyle的更多相关文章

  1. currentStyle与getComputedStyle应用

    getComputedStyle获取的是计算机(浏览器)计算后的样式,但是不兼容IE6.7.8(主要用于非IE浏览器) currentStyle方法兼容IE6.7.8,但是不兼容标准浏览器(主要用于I ...

  2. style,currentStyle,getComputedStyle的区别和用法

    先说说层叠样式表的三种形式(三种的叫法不一,按照各自的习惯): 一.内联样式:在HTML标签用style属性设置.如: 1 <p >这是内联样式</p> 二.嵌入样式:通过&l ...

  3. getComputedStyle/currentStyle/style之间的爱恨情仇

    getComputedStyle是? getComputedStyle是一个可以获取当前元素所有最终使用的CSS属性值.返回的是一个CSS样式声明对象([object CSSStyleDeclarat ...

  4. JavaScript中style, currentStyle和 getComputedStyle的异同

    今天在做项目的时候,习惯性的用到了element.style.width,然而浏览器却报错,错误提示是style is undefined,这是我才意识到,内联样式表和外联样式表在js应用中也有很大的 ...

  5. dede currentstyle属性完美解决方案

    问题一.dede让channelartlist标签支持currentstyle属性 完美解决 打开include\taglib\channelartlist.lib.php找到$pv->Fiel ...

  6. .style, .getComputedStyle(),.currentStyle区别

    1)style只能获取行间样式(写在标签里面的):能读能写 2)currentStyle是专属ie的属性,区别他返回的是最终样式 及包括行间和外链css 3)getComputedStyle是一个可以 ...

  7. 解决织梦channel标签 指定typeid或设置son时 currentstyle无效的修复办法

    {dede:channel type='son' row='8' currentstyle="<li><ahref='~typelink~' class='thisclas ...

  8. js中return,this,arguments,currentStyle和getComputedStyle小析

    一.return返回值:1.函数名+括号:fn()==>return 后面的值2.所有函数默认返回值:未定义3.return后面的任何代码都不会执行二.this:当前对象1.当某个对象后边加事件 ...

  9. CSSOM之getComputedStyle,currentStyle,getPropertyValue,getAttribute

    js关于CSSOM编程的样式相关几个常用的方法 webkit:getComputedStyle,getPropertyValue IE:currentStyle,getAttribute 前言 jqu ...

随机推荐

  1. 多线程BackroundWorker 使用

    参考文章:http://www.cnblogs.com/inforasc/archive/2009/10/12/1582110.html using System; using System.Coll ...

  2. WPS Office文档未保存怎么恢复

    有时候用WPS Office时,文档还没保存,因为电脑卡死或者关机,再次打开时编辑的内容都不见了,这个时候可以利用WPS自带的备份功能来恢复文档,表格.幻灯片.文档都是可以的. 首先单击WPS左上角的 ...

  3. Delphi cxGrid –--> RecordIndex out of Range

    delphi 导出数据时常常出现这样一个错误 < RecordIndex out of Range > 处理办法: 设定 cxGridDBTableView 的 GridModeBuffe ...

  4. 12. javacript高级程序设计-DOM2和DOM3

    1. DOM2和DOM3 DOM2级规范定义了一些模块,用于增强DOM1级.“DOM2级核心”为不同的DOM类型引入了一些与XML命名空间有关的方法,这些变化只在使用XML或者XHTML,对于HTML ...

  5. JS_ECMA基本语法中的几种封装的小函数-1

    今天给大家介绍js ECMA中几个封装的小函数以及一些常用的函数小案例: 1,找重复的函数 <script> //在数组里面找重复: function findInArr(n,arr){ ...

  6. iOS-Runtime-Headers

    iOS8.4 及之前的头文件 私有及共有API https://github.com/nst/iOS-Runtime-Headers  

  7. Android 实现类似微信客户端朋友圈更新提示的小红点&栏目订阅

    用到的类: com.jauker.widget.BadgeView 实现代码: BadgeView imageBadge = new BadgeView(getContext()); imageBad ...

  8. Python读取xml报错解析--ExpatError: not well-formed (invalid token)

    xml文件内容如代码所示存入的名字为login.xml: <?xml version="1.0" encoding="utf-8"?> <in ...

  9. 判断图片的类型(图片是data类型 )

    + (NSString *)typeForImageData:(NSData *)data { uint8_t c; [data getBytes:&c length:1]; switch ( ...

  10. JavaWeb学习之什么JSP、JSP是如何工作的、JSP语言(各种指令和九大内置对象)、EL表达式简单使用(5)

    1.什么JSP * servlet:java编写的处理动态web的技术 * 特点:Java代码中嵌套html代码 * jsp * 特点:HTMl代码中嵌套java代码 * %tomcat%/conf/ ...