一、程序结构

程序结构:程序的执行顺序

  • 顺序结构
  • 选择(分支)结构
    if语句
    if…else
    if…else if…else
    switch
  • 循环结构
    for
    while
    do…while
    for…in

二、分支结构

  1. if 语句
//语法:
if(条件){
	代码块;
}

//执行规则:若条件成立,则执行代码块

示例:

//周五考试,60分以上及格
        var score = prompt("请输入分数:");//输入框   返回值: 点击确定按钮时,返回  输入框的内容,,点击取消按钮时,返回null
        // console.log(score);
        if (score > 60) {
            alert("及格");
        }
  1. if…else语法
//语法
if(条件){
	代码块;
}else{
	代码块;
}

//执行规则:若条件成立,则执行对应的代码块;否则,执行else对应的代码块

示例:

//根据用户年龄,判断用户是否可以进入网吧 
        var age = prompt("请输入用户的年龄:");
        if (age >= 18) {
            alert("尽情玩耍吧");
        } else {
            alert('回家写作业吧');
        }

若if或者else语法后面的代码只要一句,则可以省略{}

3.多分支语句

//语法
if(条件1){
	代码块1;
}else if(条件2){
	代码块2;
}
...
else if(条件n){
	代码块n;
}else{
	代码块m;
}

//执行规则:条件1成立,则执行对应的代码块1,

示例:

// 周五考试     60分以下的补考  90分以上的 优秀  其它  及格
        var score = prompt('请输入分数:');
        // if (score < 60) {
        //     alert("补考")
        // } else if (score >= 60 && score <= 90) {
        //     alert("及格")
        // } else if (score > 90) {
        //     alert("优秀,有奖...");
        // } else {
        //     alert('请重新输入');
        // }

        if (score > 90) {
            alert("优秀,,奖励");
        } else if (score > 60) {
            alert("及格");
        } else if (score > 0) {
            alert("补考");
        } else {
            alert('非法输入');
        }

4.if语句的嵌套

在分支语句中可以嵌套其它的分支语句

if(){
	if(){}else{}
}


if(){

}else{
	if(){}
}

示例:

//周五考试   60分以下补考,其它及格
        var score = prompt("请输入考试分数:");
        if (score != null) {
            if (score >= 60) {
                alert('及格');
            } else {
                alert("补考");
            }
        } else {
            alert("点击了取消按钮");
        }

        //点击  取消   score   null

5.switch结构

//语法:
switch(表达式){
	case 值1:
		代码块;
	break;
	case 值2:
		代码块;
	break;
	...
	case 值n:
		代码块;
	break;
	default:
		代码块;
	break;
}

//执行规则:switch后的表达式与case后面的值相等时,即执行对应的代码块;若都不相等,则执行default对应的代码

示例:

switch (slt.value) {        //   slt.value=== "+"
            case "+":
                console.log(v1 + v2);
                break;
            case "-":
                console.log(v1 - v2);
                break;
            case "*":
                console.log(v1 * v2);
                break;
            case "/":
                console.log(v1 / v2);
                break;
            default:
                console.log(v1 + v2);
                break;
        }

注意:switch.case的比较是一个全等的比较 (===)

注意:break的问题,若省略,会出现穿透问题。

三、DOM中查找节点对象的方法

1.根据id找元素

document.getElementById(id);//唯一的节点对象      不存在 null

2.根据标签名找元素

//在文档中,根据标签名找元素
document.getELementsByTagName(tagName);
//在指定的节点下找元素
node.getElementsByTagName(tagName);

该方法的返回值是一个集合(类数组/伪数组), 集合有:length属性,索引

可以通过索引来取出里面的值 : 集合[索引]

3.根据class来找元素

//根据类名找元素
document.getElementsByClassName(cls);

返回值:集合

四、循环结构

重复的执行一段代码

1.for循环

//语法
for(循环变量初始化;循环条件判断;循环迭代){
	循环体;
}
/*
	执行规则:for循环的执行可以分为如下几步:
	第一步:循环变量初始化					var i=0;
	第二步:循环条件的判断					i<5
		若判断结果为真,则执行第三步
		若判断结果为假,则结束循环
	第三步:执行循环体					 console.log(i)
	第四步:循环的迭代					 i++
	第五步:回到第二步
*/
for (var i = 0; i < 5; i++) {
            console.log(i);
        }

2.循环嵌套

外层循环执行一次,内层循环执行一遍

/*
                *
                ***
                *****
                *******

                行号        *个数
                1           1
                2           3
                3           5
                4           7

                n           2*n-1
        */
        //控制行数
        for (var i = 1; i < 5; i++) {
            //打印一行*
            for (var j = 0; j < 2 * i - 1; j++) {
                document.write('*');
            }
            document.write("<br>");
        }

3.break和continue

break与continue的区别:

break结束循环

continue 结束本次循环,继续下一次循环

注意:break和continue都是只对所在循环生效(不能控制外层的循环)