可变参数,css函数,获取非行间样式
程序员文章站
2022-07-04 21:33:08
...
1、可变参数
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>可变参数</title>
</head>
<script>
window.onload= function(){
function sum1(){
var sum=0;
for(var i=0;i<arguments.length;i++){
sum+=arguments[i];
}
return sum;
}
alert(sum1(1,2,3,4,5,6,7));
}
</script>
<body>
</body>
</html>
2、css函数
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>css函数</title>
<script>
window.onload=function(){
//css1()和css2()是两个函数,但是功能是相同的。为了防止arguments出现太多容易混乱。所以给他们起一个名字
function css1(){
if(arguments.length==2){
//记得填写return,这样外部才能接收
return arguments[0].style[arguments[1]];
}else{
arguments[0].style[arguments[1]]=arguments[2];
}
}
function css2(obj,name,value){
if(arguments.length==2){
//记得填写return,这样外部才能接收
return obj.style[name];
}else{
obj.style[name]=value;
}
}
var oDiv = document.getElementById('oDiv');
alert(css2(oDiv,'width'));
//里面使用的是字符串
css2(oDiv,'background','green');
}
</script>
</head>
<body>
<div id='oDiv' style="width: 100px;height: 100px;background: red;">
</div>
</body>
</html>
3、获取非行间样式
使用window.onload()时,里面不能嵌套别的函数,但是可以调用别的函数。
获取非行间样式有两种方法。
一是:currentStyle使用方法和style相同,但是只有IE兼容,
二是:getComputedStyle,使用方法是getComputedStyle(oDiv,false).width;其中第一个参数是要获取的对象的名称,第二个参数是一个随意的值。
取行间样式时,不能够使用getComputedStyle来取复合样式,比如background,但是如果想要取背景颜色,可以使用backgroundcolor
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>获取非行间样式</title>
<style>
#div1{width: 300px; height: 200px; background: red;}
</style>
<script>
window.onload=function(){
huoqu();
}
function huoqu(){
var oDiv = document.getElementById('div1');
if(oDiv.currentStyle){
alert(oDiv.currentStyle.width);
}else{
alert(getComputedStyle(oDiv,false).width);
}
}
</script>
</head>
<body>
<div id='div1'>
</div>
</body>
</html>
上一篇: ZooKeeper——伪集群