javascript函数的声明和调用、有参函数和无参函数、有返回值

最新推荐文章于 2022-08-18 22:46:41 发布

王华桥

最新推荐文章于 2022-08-18 22:46:41 发布

阅读量1.3k

点赞数 1

分类专栏： js小记文章标签： javascript 函数对象

本文链接：https://blog.csdn.net/whqwyn/article/details/52791273

版权

js小记专栏收录该内容

24 篇文章 0 订阅

订阅专栏

函数声明与调用

JavaScript是弱类型语言，声明一个对象的时候用var声明，声明一个函数用function()。
当你需要调用一个函数的时候，首先你需要声明一个函数才能调用，而且需要有函数名。

有参函数与无参函数

有参函数是指定义的函数里面有变量，暂时替代位置用的。一般地，函数声明用形参，函数调用就用实参（用实参代替形参去运行，即传参）。

无参函数就是定义的函数里面没有变量，都是“定值”。

返回值

只有给定return的函数才有返回值，一个函数只有一个返回值，同时会终止函数运行(跳出函数)。

土豆右下角菜单悬浮效果
链式运动

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title></title>
        <link rel="stylesheet" type="text/css" href="css/new_file.css"/>
<style type="text/css" >
*{
    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
    font-family: "微软雅黑";
}
.clearfix:after{
    content: '';
    display: block;
    clear: both;
    visibility: hidden;
}
#BodyBox{
    width: 100%;
    position: relative;
    overflow: hidden;
    background-color: #10172e;
}
#MiniBox{
    width: 202px;
    height: 50px;
    position: absolute;
    bottom: 0;
    right: 0;
}
#Btn{
    width: 202px;
    height: 50px;
    position: absolute;
    right: 0;
    top: 0;
}
#btn{
    width: 32px;
    height: 50px;
    position: absolute;
    right: 0;
    top: 0;
    background: url(../img/MiniBtn.png) no-repeat left top;
    cursor: pointer;
    z-index: 10;
}
#contBox{
    width: 202px;
    height: 312px;
    position: absolute;
    right: 0;
    bottom: 48px;
    overflow: hidden;
}
#off{
    width: 9px;
    height: 9px;
    position: absolute;
    right: 14px;
    top: 12px;
    cursor: pointer;
    opacity: 0.6;
}
#off:hover{
    opacity: 1;
}

</style>
<script src="js/move.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
window.onload=function(){
    var BodyBox=document.getElementById('BodyBox');
    BodyBox.style.height=document.documentElement.clientHeight+'px';
    var Btn=document.getElementById('Btn');
    var btn=document.getElementById('btn');
    var contBox=document.getElementById('contBox');
    var off=document.getElementById('off');
    var MiniBox=document.getElementById('MiniBox');     
    Btn.style.left=MiniBox.offsetWidth+'px';    
    contBox.style.height=0+'px';

    btn.onclick=function(){
        startMove(Btn,{left:0},function(){
            startMove(contBox,{height:312});
        });
    };
    off.onclick=function(){
        startMove(contBox,{height:0},function(){
            startMove(Btn,{left:MiniBox.offsetWidth});
        });
    };  
};
</script>

    </head>
    <body>
        <div id="BodyBox">
            <div id="MiniBox">
                <img id="Btn" src="img/MiniBtnBG.png"/>
                <div id="btn"></div>
            </div>
            <div id="contBox">
                <img id="cont" src="img/cont.png"/>
                <img id="off" src="img/off.png"/>
            </div>
        </div>
    </body>
</html>