1. 程式人生 > >JS基礎5-流程控制語句之條件(if、switch)

JS基礎5-流程控制語句之條件(if、switch)

float font 標準 先生 oda AD ida tel 周四

一、if語句

正如中文翻譯一樣,如果...則...。

技術分享圖片
<script type="text/javascript">
//只有兩種情況下
    if(條件){
        要執行的語句塊;
    }else{
        要執行的語句塊;
    }
//多種情況下
    if(條件){
        要執行的語句塊;
    }else if(條件){
        要執行的語句塊;
    }else{
        要執行的語句塊;
    }
</script>
通用格式

if(這個條件滿足){則執行這個語句}

技術分享圖片
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>流程控制語句(if
,swith)</title> <script type="text/javascript"> var a=prompt(); if(a==5){ alert("a=5"); } else{ alert("a!==5"); } // 只有兩種情況 if(a<5){ alert("a<5"); } else if(a>=5&&a<=10){ alert("a>=5並且a<=10"); }
else if(a>10&&a<20){ alert("a>10並且a<20"); } else{ alert("a不在範圍內"); } </script> </head> <body> </body> </html>
例子1 技術分享圖片
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>無標題文檔</title>
<script type="text/javascript">
    var
a=prompt(); if(a>=0&&a<=100){ alert("a∈[0,100]"); } else{ alert("a?[0,100]"); } var b=prompt(); if(b<=50&&b>=0){ alert("使勁努力,不要偷懶!"); } else if(b>=50&&b<=60){ alert("就差一點點,再加把勁"); } else if(b>=80&&b<=100){ alert("你學的不錯,值得表揚"); } else if(b>=60&&b<=80){ alert("你已經進步了很多"); } else{ alert("滿分一百"); } var manheight=prompt("請輸入男士身高"); var manweight=prompt(); if(manweight-manheight+100>=-3&&manweight-manheight+100<=3){ alert("您的體重很標準"); } else{ alert("您需要更健康的生活方式"); } var womenheight=prompt(); var womenweight=prompt(); if (womenweight-womenheight+110>=3&&manweight-manheight+110<=3){ alert("您的體重很標準"); } else{ alert("您需要更健康的生活方式"); } </script> </head> <body> </body> </html>
例子2 技術分享圖片
    var a=parseFloat(prompt("請輸入一元二次方程二次冪系數a(a不等於0)"));
    var b=parseFloat(prompt("請輸入一元二次方程一次冪系數b"));
    var c=parseFloat(prompt("請輸入一元二次方程常數"));
    if("(b*b)-(4a*c)>0"){
        document.write("次方程有兩個實根");
    }
    else if("(b*b)-(4a*c)==0"){
        document.write("次方程有且只有單根");
    }
    else if("(b*b)-(4a*c)<0"){
        document.write("次方程無實數根");
    }
    else{
        document.write("請輸入正確值");
    }
一元二次方程跟

二、switch

<script type="text/javascript">
    switch(表達式){
        case 值1:執行的語句塊:break;
        case 值2:執行的語句塊:break;
        case 值3:執行的語句塊:break;
        ...
        default:執行的語句塊;
    }
</script>

csae 值:這個值必須和選取的那個地方的值的類型相同 輸入這個值時並不默認為字符串類型,輸入數字時是默認數值類型

技術分享圖片
    var a=prompt("請輸入今天是幾號");
    var    b=parseInt(a);
    switch(b){
        case 2.26:
            alert("今天是周一");break;
        case 2.27:
            alert("今天是周二");break;
        case 2.28:
            alert("今天是周三");break;
        case 3.1:
            alert("今天是周四");break;
        case 3.2:
            alert("今天是Friday");break;
        case 3.3:
            alert("今天是Starday");break;
        case 3.4:
            alert("今天是Sunday");break;
    }
例1 技術分享圖片
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Date對象</title>
<script type="text/javascript">
    //Date
    var d1=new Date();//創建兒子的第一種方法
//    document.write(d1.toString()+"<br>");
    //第二種創建方式
//    var d2=new Date("2009-02-28 18:18:18");
//    document.write(d2.toDateString());
        
    d1.setFullYear(2018);
    d1.setMonth(0);
    d1.setDate(18);
    
    
    var year=d1.getFullYear();
    var month=d1.getMonth()+1;
    var date=d1.getDate();
    var day=d1.getDay();
    switch(day){
        case 0:
            day="星期天";
            break;
        case 1:
            day="星期一";
            break;
        case 2:
            day="星期二";
            break;
        case 3:
            day="星期三";
            break;
        case 4:
            day="星期四";
            break;
        case 5:
            day="星期五";
            break;
        case 6:
            day="星期六";
            break;
        default:
            day="錯誤數據"
    }
    document.write(year+"年"+month+"月"+date+"日"+day);

    </script>
</head>

<body>
</body>
</html>
獲取時間 技術分享圖片
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>無標題文檔</title>
<script type="text/javascript">
function test(){
    var a=document.getElementById(‘name‘).value;
    var b=document.getElementById(‘sex‘).value;
    var c=document.getElementById(‘hello‘);
    var e=/\w/;
    var res=e.test(a);//正則表達式要跟上一個判斷或返回
    if(a==""){
        alert("必須輸入姓名才能彈出");
    }
//    else if(!isNaN(a)){
//        alert("必須輸入非數字才可以");
//    }
    else if(res==true){
        alert("請輸入單詞字符");
    }
    else if(a!==""){
        switch(b){
        case "s"://csae 值:這個值必須和選取的那個地方的值的類型相同 輸入這個值時並不默認為字符串類型,輸入數字時是默認數值類型
            alert(a+"你好");
            break;
        case "man":
            alert(a+"先生你好");
                break;
        case "woman":
                alert(a+"女士你好");
                break;
            default:
                alert("錯誤數據");
    }
    }
}    
</script>
</head>

<body>
<div>
    <input type="text" placeholder="姓名" id="name">
    <select name="" id="sex">
        <option value="s">性別</option>
        <option value="man">男</option>
        <option value="woman">女</option>
    </select>
    <input type="button" value="問候" id="hello" onClick="test()">
</div>
</body>
</html>
例二-問候

<script type="text/javascript">

//只有兩種情況下

if(條件){

要執行的語句塊;

}else{

要執行的語句塊;

}

//多種情況下

if(條件){

要執行的語句塊;

}else if(條件){

要執行的語句塊;

}else{

要執行的語句塊;

}

</script>

JS基礎5-流程控制語句之條件(if、switch)