天天看點

Javascript基礎六---Math内置對象,電腦,彩票執行個體

文章目錄

        • 6.1内置對象Math
        • 6.2執行個體:科學電腦
        • 6.3彩票執行個體
        • 6.4随機生成簡單驗證碼

6.1内置對象Math

  • 使用Math對象前不需要new操作來建立對象執行個體,直接調用Math對象的屬性或方法。與Date,Array不同。
  • 常見的屬性
常見的Math屬性:<br>
        Math.e  對然對數的底,約2.718<br>
        Math.PI 圓周率,約3.14
        Math.SORT2 2的平方根,約1.414
           
  • 常見的方法
常見Math方法:<br>
        Math.abs(number) 求絕對值<br>
        Math.sqrt(number) 求平方根<br>
        Math.random() 傳回0-1的随機數<br>
        Math.pow(base,exponent) 傳回數值類型base的exponent次幂<br>
        ceil函數進位取整,floor函數舍掉小數取整,round函數四舍五入取整<br>
        三角函數sin.cos,tan接受的參數是要計算的角度,機關是弧度。
           

6.2執行個體:科學電腦

<!DOCTYPE html>
<html >
<head>
    <meta charset="UTF-8">
    <title>科學電腦</title>
    <!-- 樣式表 -->
    <style>
        /*規定了所有字型的樣式*/
        {font-size:12px}
        /*視窗主體大小*/
        body{
            background-color: buttonface;
            border-style: none;
        }
        /*按鈕大小*/
        .button{
            width: 50px;
            height: 30px;
        }
        /*顯示結果的文本框樣子*/
        #txt_display {
            width: 100%;
            cursor: default;
            text-align: right;
        }
    </style>
    <!-- 腳本部分 -->
    <script>
        var calc_buttons=[0,1,2,3,4,5,6,7,8,9,".","=","+","-","*","/","AC","sin","cos","tan","asin","acos","atan","ln"];
        var previous_value=0,op="",start_new_input=true;
        //計算函數
        function calc(strCMD) {
            var objTxt=document.getElementById("txt_display");
            switch(strCMD){
                //三角函數調用Math對象相應方法
                case"sin":
                    objTxt.value=Math.sin(objTxt.value);
                    break;
                case"cos":
                    objTxt.value=Math.cos(objTxt.value);
                    break;
                case"tan":
                    objTxt.value=Math.tan(objTxt.value);
                    break;
                case"asin":
                    objTxt.value=Math.asin(objTxt.value);
                    break;
                case"acos":
                    objTxt.value=Math.acos(objTxt.value);
                    break;
                case"atan":
                    objTxt.value=Math.atan(objTxt.value);
                    break;
                case"ln":
                    objTxt.value=Math.log(objTxt.value);
                    break;
                //如果是四則運算,則執行計算
                case"+":
                case"-":
                case"*":
                case"/":
                    start_new_input=true;
                    if(op!=""&&objTxt.value!=""){
                        objTxt.value=eval(previous_value+op+objTxt.value);
                        op=strCMD;
                    }
                    else{
                        op=strCMD;
                    }
                    break;
                case"=":
                    start_new_input=true;
                    if(op!=""&&objTxt!=""){
                        objTxt.value=eval(previous_value+op+objTxt.value);
                    }
                    op="";
                    previous_value=0;
                    break;
                case"AC":
                    start_new_input=true;
                    objTxt.value="0";
                    op="";
                    previous_value=0;
                    break;
                //如果是小數
                case".":
                    if(objTxt.value.indexOf(".")!=-1)
                        break;
                default:
                    if(start_new_input){
                        start_new_input=false;
                        previous_value=objTxt.value;
                        objTxt.value="0";
                    }
                    if(objTxt.value!="0"){
                        objTxt.value+=strCMD;
                    }
                    else if(strCMD!="0"){
                        objTxt.value=strCMD;
                    }
            }
        }
        function write_table() {
            document.write("<table>");
            document.write("<tr>");
            for(var i=0;i<calc_buttons.length;i++){
                /* this 是js的關鍵字,對目前對象的引用。this指向的就是按鈕本身;
                * \""是轉義符,其僅僅代表一個雙引号; */
                document.write("<td><input value= \""+calc_buttons[i]+"\" type=\"button\" class= \"button\"  onclick=\"calc(this.value);\"></td>");
                if((i+1)%5==0){
                    document.write("</tr><tr>");
                }
            }
            document.write("</tr>");
            document.write("</table>");
        }
    </script>
</head>
<body style="overflow: auto;">
    <!-- readonly 屬性可以防止使用者對值進行修改 -->
    <input id="txt_display" value="0"readonly>
    <script>
        write_table();
    </script>
</body>
</html>
           
Javascript基礎六---Math内置對象,電腦,彩票執行個體

6.3彩票執行個體

注:readOnly屬性是隻能讀。

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=GB2312" />
<title>6-3  彩票遊戲</title>
<!-- 樣式表 -->
<style>
* { font-size:12px; } /*規定了所有的字型樣式*/
</style>
<!-- 腳本部分 -->
<script>
len = 7;//彩票号碼的位數
function calc(){
    var strNumber, strMatchNumber, strResult, intResult;
    //擷取使用者輸入的号碼
    strNumber = $("txt_number").value;
    //判斷輸入是否符合要求
    if(strNumber.length!=len || isNaN(strNumber)){ alert("輸入不符合要求"); return; }
    //扣除使用者兩元錢
    $("txt_money").value-=2;    
    //生成中獎号碼
    strMatchNumber = "";
    for(var i=0; i<len; i++)strMatchNumber+=parseInt(Math.random()*10);
    //輸出中獎号碼
    $("txt_match_number").value = strMatchNumber;
    //判斷是否中獎
    switch(intResult = test_match(strMatchNumber, strNumber)){
        //中獎的話輸出提示,并傳回現金給使用者
        case 2: case 3: case 4: case 5: case 6: case 7:
            $("txt_result").value = "恭喜你中了" + ["特","一","二","三","四","五"][len-intResult] + "等獎,獲得了" + (5000000/Math.pow(10,len-intResult)) + "元";
            $("txt_money").value = parseInt($("txt_money").value) + 5000000/Math.pow(10,len-intResult);
            break;
        //隻有一位數字和中獎号碼相同
        case 1:
            $("txt_result").value = "可惜隻差一點就中獎了,加油啊";
            break;
        //所有數字全都不同
        case 0:
        default:
            $("txt_result").value = "真可惜沒有中獎...";
    }
    //如果使用者的錢已用光
    if($("txt_money").value<1){
        if(confirm("你已經用光了所有的錢,還要再來一次嗎?")){
            //重來
            $("txt_money").value = 10;
        }else{
            //關閉視窗
            window.close();
        }
    }
}
//判斷有幾位數字相同
function test_match(str1, str2){
    var result = new Array(), matched = 0;
    //循環判斷每一位數字
    for(var i=0; i<len; i++){
        if(str1.charAt(i)==str2.charAt(i)){
            //如果第i個數字相同,則将相符的字元數加一
            matched++;
        }else if(matched>0){
            //如果第i個數字不同,且前面有matched個位數相同,則将相符的字元數儲存在數組result中
            result.push(matched);
            //清空前面字元的相同情況
            matched = 0;
        }
    }
    //如果直到循環結束,兩者都相同,儲存相同的位數
    if(matched>0)result.push(matched);
    //判斷兩者最大的相符位數
    result.sort();
    return(result.pop());
}
function $(str){ return(document.getElementById(str)); }
</script>
</head>
<body style="overflow:auto;">
<table>
    <tr>
        <td>現有資金:</td>
        <td><input id="txt_money" value="10" size="7" readonly >元</td>
    </tr>
    <tr>
        <td>輸入購買的彩票号碼(7位數):</td>
        <td><input id="txt_number" size="7" maxlength="7"></td>
    </tr>
    <tr>
        <td><input type="button" value="開獎" onclick="calc();"></td>
    </tr>
    <tr>
        <td>本期開獎号碼:</td>
        <td><input id="txt_match_number" size="7" readonly ></td>
    </tr>
    <tr>
        <td>結果:</td>
        <td><input id="txt_result" size="30" readonly ></td>
    </tr>
</table>
</body>
</html>
           
Javascript基礎六---Math内置對象,電腦,彩票執行個體

6.4随機生成簡單驗證碼

<!DOCTYPE html>
<html >
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script>
        function generate() {
            var num=[1,2,3,4,5,6,7,8,9,0]
            var str="";
            for(var i=0;i<4;i++){
                var ran=num[parseInt(Math.random()*10)];
                str+=ran;
                //alert(str);
            }
            document.getElementById("gene").value=str+"";
        }
    </script>
</head>
<body>
    <input id="gene"readonly>
    <input id="bnt" type="button" value="驗證碼" onclick="generate()">
</body>
</html>
           
Javascript基礎六---Math内置對象,電腦,彩票執行個體
Javascript基礎六---Math内置對象,電腦,彩票執行個體

繼續閱讀