while循环
do{}while()
for循环
通过一个小案例了解三个语句的语法结构:




<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!-- !while语句如何去理解呀思考一下 -->
<script>
// 用户定义一个变量 给变量的初始值为0
// 在这个案例中
// 定义的var i的初始值为 0
var i = 0;
// while(写出上面定义变量的条件)
// 在这个案例中的条件是当 i<2是
while (i < 2) {
// 如果上面的条件成立那么走下面的语句
// 如果上面i<2条件成立那么打印下面的语句信息
document.write('<h1>请输出i的值' + i + '</h1><br>')
i++
}
// 如果条件不成立那么程序走下面的语句
// 如果上面的条件不成立那么执行下面的语句信息
document.write('<h1>请输出结束i的值' + i + '</h1><br>')
</script>
</body>
</html>
while 循环执行的顺序:
// 用户定义一个变量 给变量的初始值为0
// 在这个案例中 我要打印输出 1到三的值
// 定义的var i的初始值为 0
var i = 0;
// while(写出上面定义变量的条件)
// 在这个案例中的条件是当 i<2是
while (i < 2) {
// 如果上面的条件成立那么走下面的语句
// 如果上面i<2条件成立那么打印下面的语句信息
document.write('<h1>请输出i的值' + i + '</h1><br>')
i++
}
// 如果条件不成立那么程序走下面的语句
// 如果上面的条件不成立那么执行下面的语句信息
document.write('<h1>请输出结束i的值' + i + '</h1><br>')
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
// 都会进行一次循环
// 用户定义的变量为 i 初始值为 1
var i=1;
// 如果在下面的while(条件成立的话则走下面)do{中间的循环语句信息}
do {
document.write('<h1>请输出i的值' + i + '</h1><br>');
i++
} while (i <=1)
// 如果上面的条件不成立打印输出下面的信息内容
document.write('<h1>请输出结束i的值' + i + '</h1><br>');
// 通过浏览器的循环条件你会发现内容 无论如何 do{}whiler()语句都会执行一次 比如上面的案例 打印出了
// 1 2
</script>
</body>
</html>
do...while循环执行顺序:
// do...while都会进行一次循环
// 用户定义的变量为 i 初始值为 1
var i=1;
// 如果在下面的while(条件成立的话则走下面)do{中间的循环语句信息}
do {
document.write('<h1>请输出i的值' + i + '</h1><br>');
i++
} while (i <=1)
// 如果上面的条件不成立打印输出下面的信息内容
document.write('<h1>请输出结束i的值' + i + '</h1><br>');
// 通过浏览器的循环条件你会发现内容 无论如何 do{}whiler()语句都会执行一次 比如上面的案例 打印出了
// 1 2
for循环的执行顺序:
// for循环的语句执行顺序
// 用户声明变量的起点位置在哪里
var i = 0;
// for(第一个位置填循环的起点位置;第二个空填写循环的条件;第三个空填写变量是++ 还是--)
for (i; i < 3; i++) {
// 如果上面三个位值的条件都满足的话 那么执行下面的语句信息
document.write('<h1>请输出i的值' + i + '</h1><br>');
}
// 如果条件不满足的话输出下面的语句
document.write('<h1>请输出结束i的值' + i + '</h1><br>');
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>for循环语句</title>
</head>
<body>
<script>
// for循环的语句执行顺序
// 用户声明变量的起点位置在哪里
var i = 0;
// for(第一个位置填循环的起点位置;第二个空填写循环的条件;第三个空填写变量是++ 还是--)
for (i; i < 3; i++) {
// 如果上面三个位值的条件都满足的话 那么执行下面的语句信息
document.write('<h1>请输出i的值' + i + '</h1><br>');
}
// 如果条件不满足的话输出下面的语句
document.write('<h1>请输出结束i的值' + i + '</h1><br>');
</script>
</body>
</html>
经过上面的一个案例对于三个语句的语法结构有了解吧!
采用上面讲的三个方案自己实现一下下面的题目 采用的上面三种循环
请用户在控制台打印出自己的名字10次
请用户在浏览器打印出自己的名字100次
请用户在弹窗打印出自己的名字5次
请用户在浏览器中,控制台中打印出自己的0到一百的数字
请用户在浏览器中,控制台中打印出自己的0到一百的数字;并且将和求出来,求出0到100的平均数.
请用户在浏览器中,控制台中打印出自己的0到一百的数字;并且将和求出来,求出0到100的平均数.求出奇数和
请用户在浏览器中,控制台中打印出自己的0到一百的数字;并且将和求出来,求出0到100的平均数.求出偶数和
请用户在浏览器中,控制台中打印出自己的0到一百的数字;并且在控制台打印能被3 7 9整除的数字
请用户在浏览器中,控制台中打印出自己的0到一百的数字;并且在控制台打印能被5整除的数字
请用户在浏览器中,控制台中打印出1到1000的所有的素数;
上面的基础练习自己可以去练一下:
双重for循环你是如何理解的呢?思考一个问题在table属性中tr称为行 td称为单单元格。
案例效果展示:






下篇文章给你答案