for循环if判断和弹性工具的使用案例

最新推荐文章于 2024-07-30 10:56:44 发布

笙梦亦柯

最新推荐文章于 2024-07-30 10:56:44 发布

阅读量125

点赞数

文章标签： javascript html

本文链接：https://blog.csdn.net/m0_64180592/article/details/123211820

版权

1 遍历数组Array=[7,35,60,80,99]

let array=[7,35,60,80,99]
    for (let index = 0; index < array.length; index++) {
       document.write(`${array[index]}<br/>`)
    }

运行答案：
        7
        35
        60
        80
        99

2 遍历数组studentArray，如果sex为男，输出：放学去操场打羽毛球，sex为女，输出：放学去操场打乒乓球

let studentArray=[
  		{"name":"张三","sex":"男","age":19,"height":175,"weight":145},
		{"name":"李四","sex":"男","age":19,"height":180,"weight":150},
		{"name":"王五","sex":"女","age":20,"height":170,"weight":140}
];
for(let i=0;i<studentArray.length;i++){
        if(studentArray[i]["sex"]=="男"){
            document.write(`${studentArray[i]["name"]}去打羽毛球<br/>`)
        }else if(studentArray[i]["sex"]=="女"){
            document.write(`${studentArray[i]["name"]}去打乒乓球<br/>`)
        }else{
            console.log(studentArray[i])
        }
 }
运行答案：
        张三去打羽毛球
        李四去打羽毛球
        王五去打乒乓球

3 写出下面程序输出结果

var arr1 =[5, 6, 7];
var arr2 = arr1;
var arr3 =[...arr1];
arr2[0]= 8;
console.log(arr1);
console.log(arr2);
console.log(arr3);


运行结果：
        [8,6,7]
        [8,6,7]
        [5,6,7]

4 for循环

     小明考试成绩下来了，拿着试卷回了家  
     妈妈对小明说：
     超过90分的话就带他去游乐园玩；
     超过80分的话就带他去动物园玩；
     及格的话就可以打一个小时的游戏；
     否则就等着挨打吧
    var score = 59;
    if (score > 90) {
        alert("小明可以去游乐园玩")
    } else if (score > 80) {
        alert("小明可以去动物园玩")
    } else if (score >= 60) {
        alert("小明可以打一个小时游戏")
    } else {
        alert("小明会被揍一顿")
    }

5 flex 布局（弹性工具）

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div style="width: 100%;">
        <!-- 头部 -->
        <div style="width: 100%;height: 100px;background-color: aquamarine;"></div>
        <!-- 中间 -->
        <div style="width: 100%;height: 500px;display: flex;">
            <!-- 左边 -->
            <div style="flex:1;background-color:beige"></div>
            <!-- 中间 -->
            <div style="flex:6;background-color: bisque;">
                <!-- 上 -->
                <div style="width: 100%;height: 100px;display: flex;">
                    <div style="flex: 1;background-color: rgb(24, 134, 230);"></div>
                    <div style="flex: 1;background-color: rgb(42, 195, 233);"></div>
                </div>
                <!-- 中 -->
                <div style="width: 100%;height: 200px;background-color: rgb(214, 59, 59);display: flex">
                    <div style="flex: 1;background-color: rgb(0, 247, 230);">
                        <div style="width: 100%;height: 50px;background-color: rgb(202, 112, 230);"></div>
                        <div style="width: 100%;height: 150px;background-color: rgb(92, 98, 226);"></div>
                    </div>
                    <div style="flex: 1;background-color: rgb(218, 198, 90);"></div>
                </div>
                <!-- 下 -->
                <div style="width: 100%;height: 200px;background-color: rgb(248, 14, 14);display: flex;">
                    <div style="flex: 3;background-color: rgb(134, 0, 243);">
                        <div style="width: 100%;height: 150px;background-color: rgb(149, 74, 184);"></div>
                        <div style="width: 100%;height: 50px;background-color: rgb(92, 98, 226);"></div>
                    </div>
                    <div style="flex: 1;background-color: rgb(119, 115, 122);"></div>
                </div>
            </div>
            <!-- 右边 -->
            <div style="flex:1;background-color: blue;"></div>
        </div>
        <!-- 底部 -->
        <div style="width: 100%;height: 100px;background-color: aquamarine;"></div>
    </div>
</body>

</html>

笙梦亦柯

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
for循环if判断和弹性工具的使用案例

1 遍历数组Array=[7,35,60,80,99]let array=[7,35,60,80,99] for (let index = 0; index < array.length; index++) { document.write(`${array[index]}<br/>`) }运行答案： 7 35 60 80 992 遍历数组studentArray，如
复制链接

扫一扫