html文件如何for循环,html循环代码怎么写?有几种循环语句?

在互联网的热潮中,不断的涌现出很多的技术岗位。那么今天我们就来说下有关于“html循环代码怎么写?”这个问题吧!下面是小编的一些方法和代码,希望对大家有所帮助。

1.首先我们新建个 .html 文件在文件中输入下面这些代码就可以实现循环了,会比较的相对简单。代码如下:

循环的使用

var array1 = [1,4,2,5,7,8];

//遍历数据 利用下标的变化

for(var i=0;i

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

}

//for in循环

//数组的下标,从0到最后一个

for(var j in array1){

document.write(j+"
");

}

//语句块{}

{

var num = 2;

}

document.write(num+"
");

在代码中我们通过生成数组数据,在使用for循环进行遍历,我们来看下结果;截图如下:

529ed2c1b1d5682d4e979ceba4cbe51d.png

我们看到在结果中数组按照​for​循环生成一组数据。说明我们的循环语句成功了。

2.下面是一些有关于在 Html 中的几种循环语句。

(1)、while循环:

语法:​while(条件表达式) { 语句...  };​while(条件表达式){

语句...

}

执行流程:​while​语句在执行时,先对条件表达式进行求值判断,如果值为​true​,则执行循环体,循环体执行完毕以后,继续对表达式进行判断如果为​true​,则继续执行循环体,以此类推 如果值为​false​,则终止循环

(2)、do...while循环:

语法:​do{ 语句...  } while(条件表达式);​do{

语句...

}while(条件表达式)

执行流程:​do...while​语句在执行时,会先执行循环体,循环体执行完毕以后,在对​while​后的条件表达式进行判断,如果结果为​true​,则继续执行循环体,执行完毕继续判断以此类推如果结果为​false​,则终止循环实际上这两个语句功能类似,不同的是​while​是先判断后执行,而​do...while​会先执行后判断,​do...while​可以保证循环体至少执行一次,而​while​不能

(3)、for循环:

在for循环中,为我们提供了专门的位置用来放三个表达式:初始化表达式、条件表达式、更新表达式。

语法: ​for(初始化表达式、条件表达式、更新表达式){ 语句... };​for(初始化表达式;条件表达式;更新表达式){

语句...

}

执行流程:执行初始化表达式,初始化变量(初始化表达式只会执行一次)、执行条件表达式,判断是否执行循环。如果为​true​,则执行循环; 如果为​false​,终止循环;执行更新表达式,更新表达式执行完毕继续重复。

3.循环嵌套:

在我们使用循环的使用是可以互相嵌套的,我们来看下代码:window.onload = function(){

var oList = document.getElementById('list01');

var aLi = oList.getElementsByTagName('li');

for (var i = 0; i < aLi.length; i++) {

if(i % 2 == 0){

aLi[i].style.background = 'gold';

}

}

for(var j in aLi){

aLi[j].style.background = 'red';

}

//创建一个循环,往往需要三个步骤

//1.创初始化一个变量

var j = 0;

//2.在循环中设置一个条件表达式

while(j < aLi.length){

aLi[j].style.background = 'gold';

//3.定义一个更新表达式,每次更新初始化变量

j++;

}

这就是有关于嵌套循环的代码,大家可以作为参考。

总结:

以上就是有关于“html循环代码怎么写?有几种循环语句?”这个问题的一些相关内容,当然如果你有更好的想法也可以和大家一起分享学习,更多关于前端的内容我们都可以在W3cschool中学习和了解。

  • 1
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值