当前位置：首页 > news >正文

HTML之JavaScript循环结构

news 来源：原创 2025/5/8 4:54:09

HTML之JavaScript循环结构

基本for循环与while循环与后端编程语言一致
增强for循环（foreach）需要稍微注意一下冒号换成 in，定义的临时变量表示索引而不是数组实际值

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        // for循环跟后端语言一致   99乘法表
        for(var i = 1;i<10;i++){
            for(var j = 1;j<=i;j++){
                document.write(i+"*"+j+"="+i*j+"&nbsp;&nbsp;&nbsp;&nbsp;");
            }
            document.write("<br>");
        }
        document.write("<hr>");// 水平线
        // while循环 与后端语言也一致
        var i = 1;
        while(i<10){
            var j = 1;
            while(j<=i){
                document.write(i+"*"+j+"="+i*j+"&nbsp;&nbsp;&nbsp;&nbsp;");
                j++;
            }
            document.write("<br>");
            i++;
        }
        document.write("<hr>");
        // js声明数组,与后端的区别就是不用大括号，改用方括号；声明的时候因为若类型 直接声明var即可
        var arr = ["a","b","c","d","e"];
        document.write("<ul>");
        for(var i = 0;i<arr.length;i++){
            document.write("<li>"+arr[i]+"</li>");
        }
        document.write("</ul>");
        // foreach  在前端foreach中使用in做间隔；前面的临时变量是一个索引，而不是数组内的元素
        for(var i in arr){
            document.write(i+"=>"+arr[i]+"<br>");
        }

    </script>
</head>
<body>
    
</body>
</html>