循环可以将代码块执行指定的次数。

JavaScript 循环

如果您希望一遍又一遍地运行相同的代码,并且每次的值都不同,那么使用循环是很方便的。

我们可以这样输出数组的值:

芝麻教程(web3.xin)

cars=["BMW","Volvo","Saab","Ford"];

for (var i=0;i

document.write(cars[i] + "
");

}

不同类型的循环

JavaScript 支持不同类型的循环:

for - 循环代码块一定的次数

for/in - 循环遍历对象的属性

while - 当指定的条件为 true 时循环指定的代码块

do/while - 同样当指定的条件为 true 时循环指定的代码块

For 循环

for 循环是您在希望创建循环时常会用到的工具。

下面是 for 循环的语法:

for (语句 1; 语句 2; 语句 3)

{

被执行的代码块

}

语句 1 (代码块)开始前执行

starts.

语句 2 定义运行循环(代码块)的条件

语句 3 在循环(代码块)已被执行之后执行

芝麻教程(web3.xin)

点击按钮循环代码5次。

点击这里

function myFunction(){

var x="";

for (var i=0;i<5;i++){

x=x + "该数字为 " + i + "
";

}

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

}

从上面的例子中,您可以看到:

Statement 1 在循环开始之前设置变量 (var i=0)。

Statement 2 定义循环运行的条件(i 必须小于 5)。

Statement 3 在每次代码块已被执行后增加一个值 (i++)。

语句 1

通常我们会使用语句 1 初始化循环中所用的变量 (var i=0)。

语句 1 是可选的,也就是说不使用语句 1 也可以。

您可以在语句 1 中初始化任意(或者多个)值:

芝麻教程(web3.xin)

cars=["BMW","Volvo","Saab","Ford"];

for (var i=0,l=cars.length; i

document.write(cars[i] + "
");

}

芝麻教程(web3.xin)

cars=["BMW","Volvo","Saab","Ford"];

for (var i=0,l=cars.length; i

document.write(cars[i] + "
");

}

同时您还可以省略语句 1(比如在循环开始前已经设置了值时):

芝麻教程(web3.xin)

cars=["BMW","Volvo","Saab","Ford"];

var i=2,len=cars.length;

for (; i

document.write(cars[i] + "
");

}

语句 2

通常语句 2 用于评估初始变量的条件。

语句 2 同样是可选的。

如果语句 2 返回 true,则循环再次开始,如果返回 false,则循环将结束。

如果您省略了语句 2,那么必须在循环内提供 break。否则循环就无法停下来。这样有可能令浏览器崩溃。请在本教程稍后的章节阅读有关 break 的内容。

语句 3

通常语句 3 会增加初始变量的值。

语句 3 也是可选的。

语句 3 有多种用法。增量可以是负数 (i--),或者更大 (i=i+15)。

语句 3 也可以省略(比如当循环内部有相应的代码时):

芝麻教程(web3.xin)

cars=["BMW","Volvo","Saab","Ford"];

var i=0,len=cars.length;

for (; i

document.write(cars[i] + "
");

i++;

}

For/In 循环

JavaScript for/in 语句循环遍历对象的属性:

芝麻教程(web3.xin)

点击下面的按钮,循环遍历对象 "person" 的属性。

点击这里

function myFunction(){

var x;

var txt="";

var person={fname:"Bill",lname:"Gates",age:56};

for (x in person){

txt=txt + person[x];

}

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

}

您将在有关 JavaScript 对象的章节学到更多有关 for / in 循环的知识。

While 循环

我们将在下一章为您讲解 while 循环和 do/while 循环。

html for循环正方形,JavaScript for 循环相关推荐

  1. JavaScript的循环

    JavaScript的循环 循环是将代码执行指定的次数. 一.for循环 1.for循环 for(语句1:语句2:语句3){ 执行的代码 } 注:语句1:条件的变量的初始值(代码执行前执行) 只执行一 ...

  2. 13岁女孩因发布JavaScript无限循环代码被捕

    据外媒报道,日本刈谷市警方最近逮捕了一名13岁的女学生,指控她在网上公告栏上在线分发恶意代码.这个所谓的恶意代码其实是一个恶作剧,它触发了JavaScript无限循环,在用户访问某个链接时显示&quo ...

  3. onpaste事件不生效_从实际开发中来看JavaScript事件循环的使用场景

    前言: 本文是介绍结合DOM事件流和JavaScript事件循环解决一个工作中的实际问题的过程,很多东西不只是面试的时候才会用得到 文中涉及到的代码demo地址:drag-and-eventloop ...

  4. JavaScript(循环)

    JavaScript的循环有两种,一种是for 循环,通过初始条件,结束条件和递增条件来循环执行语句块: var x = 0; var i; for(i=1; i <=10000; i++){ ...

  5. 我理解的javascript事件循环(一)

    javascript事件循环分为2种:一种是浏览器端事件循环,一种是node端事件循环. 此文只是捋一捋我对浏览器端事件循环的理解. 前言 我们都知道 JavaScript 是一门单线程语言,这意味着 ...

  6. JAVA script 循环 图片_深入分析JavaScript 事件循环(Event Loop)

    事件循环(Event Loop),是每个JS开发者都会接触到的概念,但是刚接触时可能会存在各种疑惑. 众所周知,JS是单线程的,即同一时间只能运行一个任务.一般情况下这不会引发问题,但是如果我们有一个 ...

  7. Javascript 数组循环遍历之forEach

    1.  js 数组循环遍历. 数组循环变量,最先想到的就是 for(var i=0;i<count;i++)这样的方式了. 除此之外,也可以使用较简便的forEach 方式 2.  forEac ...

  8. 在html中写for循环表格trtd,嵌套的HTML表格在javascript for循环

    我想在第一列创建一个表格,并在for循环中包含第一列中的文本和重复的HTML表格(id'questable').我不知道如何将重复的HTML表格与文档HTML的其余部分分离.当在第二个createTe ...

  9. JavaScript流程控制-循环(循环(for 循环,双重 for 循环,while 循环,do while 循环,continue break))

    目录 JavaScript流程控制-循环 循环 for 循环 执行过程: 断点调试: 案例一:求1-100之间所有整数的累加和 案例二:求1-100之间所有数的平均值 案例三:求1-100之间所有偶数 ...

最新文章

  1. ABP Zero示例项目问题总结
  2. 如何让项目一步步走向灭亡
  3. Deep-Learning-YOLOV4实践:ScaledYOLOv4模型训练自己的数据集调试问题总结
  4. python display update用不了能用filp_疯狂的Pygame——使用python写游戏(yuyu版)——基础讲解部分——第一章...
  5. Robot framework 引入 Selenium2Library 类库:
  6. jQuery操作cookie
  7. 递归思想完成n皇后问题
  8. Java里optionsMenu.add_android创建optionsmenu的方法
  9. 回归标准差和残差平方和的关系_一文详解经典回归分析
  10. java环境安装包_超详细的EFK安装部署教程--环境准备篇
  11. 计算机毕业设计的代码会查重吗,一般毕业论文会查重代码吗?
  12. lbochs模拟器最新版_Bochs模拟器
  13. 单相全控桥有源逆变电路matlab仿真,单相桥式全控整及有源逆变电路的MATLAB仿真.doc...
  14. PHP输出星座,php 通过日期推算星座的方法
  15. 开源分布式任务工作流调度系统Easy Scheduler Release 1.0.2
  16. EXFO max-715b光纤测试仪参数介绍
  17. 基于 SOFAArk 和 SOFADashboard 实现动态模块管控 | Meetup#2 回顾
  18. HyperLogLog 使用及其算法原理详细讲解
  19. PS、Excel快捷键桌面壁纸
  20. CSDN的文章如何快速转移到微信公众号上

热门文章

  1. click F5 refresh button on detail page - how to get the usable OData model
  2. try to navigate from button to line item page
  3. sap.ca.ui.model.format.NumberFormat format logic for Globalization
  4. SAP Marketing Engagement Management
  5. How to resolve error message CRM_PRODUCT_SALES-E016 during product download
  6. Difference between a normal BSP application and a WebClient UI component
  7. 如何激活React的跟踪模式和打开日志记录
  8. 一个程序员必须学会的Github使用技巧
  9. 100行代码让您学会JavaScript原生的Proxy设计模式
  10. android linearllayout 隐藏 动画,AnimatedLinearLayout:带删除动画的LinearLayout