js学习之路1 初识js函数
程序员文章站
2024-03-31 00:01:03
1. 简单的函数: 2.1 带参数的函数: 2.2 带参数的函数: 3.1 带返回值的函数 3.2 带有参数和返回值的函数 尝试把返回值用字符串拼接的方式组合了一下,还真成功了 结果: ......
1. 简单的函数:
<html> <head> <script type="text/javascript"> function myfunction() { alert("您好!") } </script> </head> <form> <input type="button" onclick="myfunction()" value="调用函数"> <p>通过点击这个按钮,可以调用一个函数。该函数会提示一条消息。</p> </body> </html>
2.1 带参数的函数:
<html> <head> <script type="text/javascript"> function myfunction(txt) { alert(txt) } </script> </head> <body> <form> <input type="button" onclick="myfunction('你好,你个蠢货...')" value="调用函数"> </form> <p> 通过点击这个按钮,可以调用一个带参数的函数。该函数会输出这个参数 </p> </body> </html>
2.2 带参数的函数:
<html> <head> <script type="text/javascript"> function myfunction(txt) { alert(txt) } </script> </head> <body> <form> <input type="button" onclick="myfunction('早安,靖哥哥!')" value="早晨"> <input type="button" onclick="myfunction('晚安,蓉儿!')" value="晚上"> </form> <p>通过点击这个按钮,可以调用一个函数。该函数会输出传递给它的参数。 </p> </body> </html>
3.1 带返回值的函数
<html> <head> <script type="text/javascript"> function myfunction() { return ("这一段话,会在结果中显示") } </script> </head> <body> <script type="text/javascript"> document.write(myfunction()) </script> <p> body部分中的脚本调用一个函数。</p> <script type="text/javascript"> document.write(myfunction()) </script> </body> </html>
3.2 带有参数和返回值的函数
尝试把返回值用字符串拼接的方式组合了一下,还真成功了
<html> <head> <script type="text/javascript"> function product(a, b, c) { return "某食品厂" + a + "年度,生产了" + b + "万箱" + c } </script> </head> <body> <script type="text/javascript"> document.write(product("2018", "15", "饼干")) </script> </body> </html>
结果:
某食品厂2018年度,生产了15万箱饼干
上一篇: 一个土包子站长的建站心得