循环结构 for() 循环

什么时候需要使用for循环 多次重复执行  多次有规律的执行
for循环的作用  可以让特定的代码执行指定的次数

for(表达式1;表达式2;表达式3){ 循环体(重复执行的代码) }
for(初始化循环变量;循环条件;更新循环变量值){循环体(重复执行的代码)}

for(var n=0;n<5;n++){ console.log("今天吃饭了") }

执行过程
    1.初始化循环变量   var n = 0
    2.判断循环条件     n<5  
                     条件成立   执行循环体
           条件不成立  结束循环
    3.更新循环变量  n++  
        4.回到步骤2

 基础用法

<script>
        /*  
                for(表达式1;表达式2;表达式3){ 循环体 }
                for(初始化循环变量;循环条件;更新循环变量值){  循环体}
        */
        for (var n = 1; n < 10; n++) { // n = 1 2 3 4 5 6 7 8 9 10
            console.log("你今天吃饭了吗")
        }
        console.log(n);//10
    </script>

循环生成标签案例

body>
    <button>生成</button>
    <ul>

    </ul>
    <script>
        var arr = ["赵四成精", "刘能变形", "中国老年人才网正式上线", "拍婚纱照 新郎被劈死"]
        // 需求  点击生成按钮  生成四个新闻
        // 1.获取元素
        var btn = document.getElementsByTagName("button")[0];
        var list = document.getElementsByTagName("ul")[0];
        // 2.添加点击事件
        btn.onclick = function () {
            for (var i = 0; i < 4; i++) { // i = 0 
                //  将原先的内容获取到  + 新内容
                // arr[0]  arr[1]  arr[2]  arr[3]
                list.innerHTML += "<li>" + arr[i] + "</li>"
                /* 
                    i=0     "<li>赵四成精</li>"
                    i = 1    "<li>赵四成精</li>" +  "<li>刘能变形</li>"
                    i = 2  
                */
            }
        }
    </script>
</body>