一，效果图。

二，代码。

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">

    <title>javascript while循环</title>

</head>

<body>

    <!--while循环-->

    <p>点击下面的按钮，只要 i 小于 5 就一直循环代码块。</p>

    <button onclick="myFunction()">点击这里</button>

    <p id="demo"></p>

    <script>

    function myFunction() {

        var x = "",

            i = 0;

        while (i < 5) {

            x = x + "The number is " + i + "<br>";

            i++;

        }

        document.getElementById("demo").innerHTML = x;

    }

    </script>

    <!--do-while循环-->

    <p>点击下面的按钮，只要i小于5就一直循环代码块</p>

    <button onclick="myFunction()">点击这里</button>

    <p id="demo1"></p>

    <script>

    function myFunction() {

        var x = "",

            i = 0;

        do {

            x = x + "the number is" + i + "<br>";

            i++;

        }

        while (i < 5)

        document.getElementById("demo1").innerHTML = x;

    }

    </script>

</body>

</html>

参考资料：《菜鸟教程》

【代码笔记】Web-JavaScript-javascript while循环的更多相关文章

  1. html+css+javascript实现列表循环滚动示例代码

    使用html+css+javascript实现列表循环滚动,设置时间定时,在规定的时间内替换前一个节点的内容,具体示例如下,感兴趣的朋友可以参考下 说明:设置时间定时,在规定的时间内替换前一个节点的内 ...

  2. WEB前端--JavaScript

    JavaScript JavaScript基础 一.JavaScript简介 JavaScript是一种嵌入到HTML文件中的描述性语言,由浏览器的解释器将其动态地处理成可执行的代码,能独立地完成与客 ...

  3. Web Worker javascript多线程编程（一）

    什么是Web Worker? web worker 是运行在后台的 JavaScript,不占用浏览器自身线程,独立于其他脚本,可以提高应用的总体性能,并且提升用户体验. 一般来说Javascript ...

  4. JavaScript基础——实现循环

    循环是多次执行同一段代码的一种手段.当你需要在一个数组或对象集上重复执行相同的任务时,这是非常有用的. JavaScript提供执行for和while循环的功能. 1.while循环 JavaScri ...

  5. Web前端-JavaScript基础教程上

    Web前端-JavaScript基础教程 将放入菜单栏中,便于阅读! JavaScript是web前端开发的编程语言,大多数网站都使用到了JavaScript,所以我们要进行学习,JavaScript ...

  6. Web开发——JavaScript基础

    参考学习: MDN JavaScript:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript ECMAScript 6入门(阮一峰):htt ...

  7. JavaScript数组forEach循环

    JavaScript数组forEach循环 今天写JavaScript代码把forEach循环数组忘记写法了,在此记录一下以防止未来忘记. let a = [1, 2, 3]; a.forEach(f ...

  8. [译] JavaScript 的事件循环

    译者注 本译文基本是按原文的意思来翻译,但对于 JavaScript 的事件循环,个人感觉还是 Philip Roberts 的视频讲解更形象些,思路和本文大致相同,不过他把事件表理解为 Web AP ...

  9. JavaScript 中 for 循环

    在ECMAScript5(简称 ES5)中,有三种 for 循环,分别是: 简单for循环 for-in forEach 在2015年6月份发布的ECMAScript6(简称 ES6)中,新增了一种循 ...

  10. 【转】Web Worker javascript多线程编程（一）

    原文:https://www.cnblogs.com/peakleo/p/6218823.html -------------------------------------------------- ...

随机推荐

  1. Kali学习笔记31：目录遍历漏洞、文件包含漏洞

    文章的格式也许不是很好看,也没有什么合理的顺序 完全是想到什么写一些什么,但各个方面都涵盖到了 能耐下心看的朋友欢迎一起学习,大牛和杠精们请绕道 目录遍历漏洞: 应用程序如果有操作文件的功能,限制不严 ...

  2. TensorFlow中的变量和常量

    1.TensorFlow中的变量和常量介绍 TensorFlow中的变量: import tensorflow as tf state = tf.Variable(0,name='counter') ...

  3. ImportError: No module named '_tkinter', please install the python3-tk package

    ImportError: No module named '_tkinter', please install the python3-tk package 先更新包,命令:sudo apt-get ...

  4. react native项目启动需要做的操作

    一.启动: 1.查看端口(默认8081是否被占用) netstat -ano   可以查看所有的进程 2.netstat -ano | findstr "8081"  查看某个端口 ...

  5. 课程回顾-Neural Network & Deep Learning

    为什么深度学习发展了数据计算算法发展Logistics RegressionNumpyreshape的计算代价很小,所以你不确定数据维度的时候都可以放上一些解决潜在bug的trick做了归一化之后梯度 ...

  6. linux读书笔记1

    (1)进入控制台命令快捷键:Ctrl+alt+F1~F7

  7. 2016 ACM/ICPC亚洲区青岛站现场赛（部分题解）

    摘要 本文主要列举并求解了2016 ACM/ICPC亚洲区青岛站现场赛的部分真题,着重介绍了各个题目的解题思路,结合详细的AC代码,意在熟悉青岛赛区的出题策略,以备战2018青岛站现场赛. HDU 5 ...

  8. 翻译：如何向MariaDB中快速插入数据(已提交到MariaDB官方手册)

    本文为mariadb官方手册:How to Quickly Insert Data Into MariaDB的译文. 原文:https://mariadb.com/kb/en/how-to-quick ...

  9. 自定义了一个email模块，符合大多数人的使用习惯

    # coding: utf-8 import smtplib from email.mime.multipart import MIMEMultipart from email.mime.text i ...

  10. 聊聊数据库~2.SQL环境篇

    传统数据库 上篇文章:聊聊数据库~开篇 https://www.cnblogs.com/dotnetcrazy/p/9690466.html 本来准备直接开讲NoSQL的(当时开篇就是说的NoSQL) ...