JS(第八课)循环语句<一>

发布于:2022-10-18 ⋅ 阅读:(554) ⋅ 点赞:(0)
  •   while循环

  •   do{}while()

  • for循环

通过一个小案例了解三个语句的语法结构:

while的循环的条件是什么呀!
这是上面的结果

 

如果在上面加上一句话呢结果为几呀!

 

这是结果
<!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>

经过上面的一个案例对于三个语句的语法结构有了解吧!

采用上面讲的三个方案自己实现一下下面的题目 采用的上面三种循环

  1. 请用户在控制台打印出自己的名字10次 

  2. 请用户在浏览器打印出自己的名字100次

  3. 请用户在弹窗打印出自己的名字5次

  4. 请用户在浏览器中,控制台中打印出自己的0到一百的数字

  5. 请用户在浏览器中,控制台中打印出自己的0到一百的数字;并且将和求出来,求出0到100的平均数.

  6. 请用户在浏览器中,控制台中打印出自己的0到一百的数字;并且将和求出来,求出0到100的平均数.求出奇数和

  7. 请用户在浏览器中,控制台中打印出自己的0到一百的数字;并且将和求出来,求出0到100的平均数.求出偶数和

  8. 请用户在浏览器中,控制台中打印出自己的0到一百的数字;并且在控制台打印能被3 7 9整除的数字

  9. 请用户在浏览器中,控制台中打印出自己的0到一百的数字;并且在控制台打印能被5整除的数字

  10. 请用户在浏览器中,控制台中打印出1到1000的所有的素数;

上面的基础练习自己可以去练一下:

双重for循环你是如何理解的呢?思考一个问题在table属性中tr称为行 td称为单单元格。

案例效果展示:

行如何实现

 

单元格如何去实现重在一行中布局

 

表格如何实现 出来用html写出来我们是不是可以遍历出来呀

 

如何理由2层for循环呢?

 

这个表格如何实现呢

 

这个如何实现

 下篇文章给你答案

本文含有隐藏内容,请 开通VIP 后查看

网站公告

今日签到

点亮在社区的每一天
去签到