定义函数、调用函数、参数、返回值
关键字function定义函数，格式如下：
function 函数名()
{
函数体
}
调用函数、参数、返回值的规则和c语言规则类似。
1 <!DOCTYPE html>
2 <html>
3 <head lang="en">
4 <meta chaset="UTF-8">
5 <title></title>
6 </head>
7 <body>
8 <script>
9 function sum(a,b) //定义一个加法函数，有两个参数a和b
10 {
11 var x=a+b;
12 return x; //return返回值
13 }
14 var s=sum(1,2); //使用这个函数
15 alert(s); //将结果弹窗显示
16 </script>
17 </body>
18 </html>
用一个按钮调用函数
1 <!DOCTYPE html>
2 <html>
3 <head lang="en">
4 <meta chaset="UTF-8">
5 <title></title>
6 </head>
7 <body>
8 <script>
9 function sum(a,b) //定义一个加法函数
10 {
11 var x=a+b;
12 alert(x); //将结果弹窗显示
13 }
14 </script>
15 <form>
16 <input type="button" value="按钮" onclick="sum(10,20)"> //用按钮调用函数
17 </form>
18 </body>
19 </html>
或者
1 <!DOCTYPE html>
2 <html>
3 <head lang="en">
4 <meta chaset="UTF-8">
5 <title></title>
6 </head>
7 <body>
8 <script>
9 function sum(a,b) //定义一个加法函数
10 {
11 var x=a+b;
12 alert(x); //将结果弹窗显示
13 }
14 </script>
15 <button onclick="sum(10,20)">按钮</button>
16 </body>
17 </html>
调用效果如下：
将函数的返回值替换标签内容
1 <!DOCTYPE html>
2 <html>
3 <head lang="en">
4 <meta chaset="UTF-8">
5 <title></title>
6 </head>
7 <body>
8 <p id="pid">hello</p>
9 <script>
10 function demo(name,age)
11 {
12 return "hello:"+name+",我的年龄是:"+age;
13 }
14 document.getElementById("pid").innerHTML=demo("tom",18);//将demo函数的返回值替换id="pid"的标签内容
15 </script>
16 </body>
17 </html>
局部变量和全局变量
1 <!DOCTYPE html>
2 <html>
3 <head lang="en">
4 <meta chaset="UTF-8">
5 <title></title>
6 </head>
7 <body>
8 <script>
9 var x=10; //全局变量
10 function demo(name,age)
11 {
12 var y=10; //局部变量，只能在函数内使用
13 z=10; //全局变量
14 }15 </script>
16 </body>
17 </html>
时间： 2024-08-05 07:07:54