JavaScript学习（三）-函数

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/CCP5626/article/details/70990947

1.定参函数

function sum( a,b,c){
    return a+b+c;
    }

2.不定参函数

funtion sum(){
    var result=0;
    for(var i=0;i<arguments.length;i++)
    {
        result+=arguments[i];
    }
}
//arguments是传入的参数所形成的数组

CSS函数
两个参数时表示获取样式
三个参数表示设置样式

function css(){
                if(arguments.length==2)
                {
                    alert(arguments[0].style[arguments[1]]);
                }
                else{
                    arguments[0].style[arguments[1]]=arguments[2];
                }
            }
            window.onload=function(){
                var oDiv=document.getElementById("div1");
                css(oDiv,'width');
                css(oDiv,'background','green');
            };

上述更好的写法：
使用 传参的形式，提高可读性

function css(obj,name,value){
                if(arguments.length==2)
                {
                    alert(obj.style[name]);
                }
                else{
                    obj.style[name]=value;
                }
            }
            window.onload=function(){
                var oDiv=document.getElementById("div1");
                css(oDiv,'width');
                css(oDiv,'background','green');
            };

取非行间样式
IE下使用
obj.currentStyle[attr]
chrome,fox下是使用
getComputedStyle(obj,null)[attr]

window.onload=function(){
                var oDiv=document.getElementById("div1");
                if(oDiv.currentStyle)
                {
                    //IE
                    alert(oDiv.currentStyle.width);
                }
                else{
                    //Chorme,fox
                    alert(getComputedStyle(oDiv,null).width);

                }
            };

封装为函数

function getStyle(obj,name)
            {
                //IE
                if(obj.currentStyle)
                {
                    return obj.currentStyle[name];
                }
                //chrome,fox
                else
                {
                    return getComputedStyle(obj,null)[name];
                }
            }
            window.onload=function(){
                var oDiv=document.getElementById("div1");
                alert(getStyle(oDiv,'width'));
            };

css样式：
复合样式 background border….
使用css函数取非行间样式时，必须是getStyle(oDiv,’background-color’);
简单样式 width….