获取行间样式
在说这个之前先重点说一个对象 arguments。这个对象的作用是能把 javascript函数内的所有参数都读取得到,也就是说javascript把传进函数的参数都存储到了这个对象里了。
例如:
function plus(){
var res=0; //这是定义结果
//arguments.length 获取传进参数的数量(类似于获取数组长度)
for(var i=0;i<arguments.length;i++){
res+=arguments[i]; //累加每一个传进的参数
}
return res;
}
window.onload=function(){
alert(plus(8,12,3,1,2));
}
这样随便传几个数字进去通过 arguments 对象获取到每一个参数,然后循环相加得出的结果就是:
这个对象我感觉很有用所以就特别声明多说了几句,希望对你也有用。
接下来进入正题:获取和修改css行间样式
/*
obj 标签id
name 样式名
value 样式值
*/
function getStylecss(obj,name,value){
//如果有两个参数传进来则返回该对象的name值。表示获取值,否则就是设置值
if(arguments.length==2){
return obj.style[name];
}else{
obj.style[name]=value;
}
}
知道了 arguments 函数的作用了之后有一定相信javascript基础的朋友都能看得出来这个函数的基本原理是什么。如果不知道也没关系下面我准备了一个案例。相信看完这个小案例了之后你一定就知道是怎么回事了。
<!DOCTYPE html>
<html>
<head>
<script>
function getStylecss(obj,name,value){
if(arguments.length==2){
return obj.style[name];
}else{
obj.style[name]=value;
}
}
window.onload=function(){
//获取id
var oDiv=document.getElementById('div1');
//获取背景颜色
//alert(getStylecss(oDiv,'background'));
//设置背景颜色
getStylecss(oDiv,'background',blue);
}
</script>
</head>
<body>
<div id='div1' style="width:200px;height:200px;background:red;">
</body>
</html>
结果就是:
这个案例很简单,只要拿回去运行一下就差不多知道怎么回事了。