一,效果图。

二,代码。

<!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学习笔记37:APPSCAN

    APPSCAN是一款商业Web扫描器,被IBM公司收购 功能和AVWS.Burp类似,不过界面更加简单 APPSCAN的使用比Burp等开源软件要简单很多 所以我这里写得内容比较少,不过它的功能还是很 ...

  2. Python中变量的基本使用

    变量的基本使用 程序就是用来处理数据的,而变量就是用来存储数据的 目标 变量定义 变量的类型 变量的命名 01. 变量定义 在 Python 中,每个变量 在使用前都必须赋值,变量 赋值以后 该变量 ...

  3. java开发面试问题

    Java面试题:java的垮平台原理 为什么要跨平台使用????? 其实说白了就是个操作系统支持的指令集是不一样的.我们的程序需要再不同的操作系统上运行这些代码. 但是不要说jvm是跨平台的,而真正跨 ...

  4. JSON库的使用研究(二)

    Java 中哪个 JSON 库的解析速度是最快的? 这个问题有意义吗?各个JSON库的性能差距不大?呵呵,差距大不大,自己往下看吧! 这个问题我们应该分为以下四个维度进行研究: 1.序列化 2.反序列 ...

  5. mysql 开发进阶篇系列 2 SQL优化(explain分析)

    接着上一篇sql优化来说 1. 定位执行效率较低的sql 语句 通过两种方式可以定位出效率较低的sql 语句. (1) 通过上篇讲的慢日志定位,在mysqld里写一个包含所有执行时间超过 long_q ...

  6. java-vip介绍

    大叔Springboot+微服务+持续集成和交付VIP(价格:5000元) springboot部分 微服务部分 持久集成和交付部分 springboot部分 视频课(10讲) 项目源代码(api r ...

  7. 【Python】Python3纯代码极简教程

    #!/usr/bin/python3 ''' Python3.6.x简单教程  示例.注释  交互式和脚本式编程  变量类型  数字(Number)  字符串(String)  列表(Li ...

  8. flask中接收post传递数组方法

    list = request.form.getlist("表单名")

  9. Java设计模式学习记录-备忘录模式

    前言 这次要介绍的是备忘录模式,也是行为模式的一种 .现在人们的智能手机上都会有备忘录这样一个功能,大家也都会用,就是为了记住某件事情,防止以后自己忘记了.那么备忘录模式又是什么样子的呢?是不是和手机 ...

  10. ORA-00257 archiver error的处理

    ORA-00257 archiver error的处理 检查flash recovery area的使用情况 SQL> set linesize 100 SQL> col paramete ...