JavaScript流程控制语句与函数
本文目录
流程控制语句
函数绑定事件：方法一绑定事件：方法二参考
流程控制语句
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>流程控制语句</title>
</head>
<body>
<script type="text/javascript">
// break : 跳出循环
// continue : 跳过本次循环
outer: for(var i = 0; i < 10; i++) {
for(var j = 0; j < 10; j++) {
if(i == 5 && j == 5) {
break outer;
}
document.write("i:" + i + ",j:" + j )
}
document.write("<br/>")
}
var a = 3;
switch(a) {
case 1:
document.write("周1");
break;
case 2:
document.write("周2");
break;
case 3:
document.write("周3");
break;
case 4:
document.write("周4");
break;
case 5:
document.write("周5");
break;
case 6:
document.write("周6");
break;
case 7:
document.write("周7");
break;
default:
document.write("出错了");
break;
}
if(a == 1) {
document.write("周1");
} else
if(a == 2) {
document.write("周2");
} else
if(a == 3) {
document.write("周3");
} else
if(a == 4) {
document.write("周4");
} else
if(a == 5) {
document.write("周5");
} else
if(a == 6) {
document.write("周6");
} else
if(a == 7) {
document.write("周7");
} else {
document.write("出错了");
}
</script>
</body>
</html>函数
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script type="text/javascript">
// 无参无返回值的函数
function fn1() {
document.write("无参无返回值的函数")
}
// 有参无返回值的函数
function fn2(a, b) {
document.write("有参无返回值的函数:a:" + a + ",b:" + b)
}
// 无参有返回值的函数
function fn3() {
return 2;
}
// 有参有返回值的函数
function fn4(a, b) {
return a + b;
}
// 调用函数
// fn1();
// fn2(1, "3");
var result = fn4(2,3)
console.log(result)
</script>
</body>
</html>绑定事件：方法一
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script type="text/javascript">
function login() {
document.write("登录成功")
}
</script>
<!--
函数绑定的第一种方式 : 使用属性
在标签中声明 对应的事件属性 onclick = "方法名()"
-->
<input type="button" value="登录" onclick="login()" />
</body>
</html>绑定事件：方法二
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
// 监听页面加载完成的事件
window.onload = function() {
// 1. 查找元素
var id_input = document.getElementById("id_input");
// 2. 派发事件
id_input.onclick = function() {
document.write("登录成功")
}
}
</script>
</head>
<body>
<input type="button" value="登录" id="id_input" />
<!--
函数绑定的第二种方式 : 事件的派发
HTML代码执行的顺序 : 从上往下,从左往右
-->
</body>
</html>本文参与 腾讯云自媒体分享计划，分享自微信公众号。
原始发表：2019-12-24，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读
目录