2021-06-09

最新推荐文章于 2021-06-30 13:43:10 发布

是酷婷呀～

最新推荐文章于 2021-06-30 13:43:10 发布

阅读量57

点赞数

分类专栏：笔记

本文链接：https://blog.csdn.net/m0_46446321/article/details/117730894

版权

笔记专栏收录该内容

9 篇文章 0 订阅

订阅专栏

某个公司采用公用电话传递数据，数据是四位的整数，在传递过程中是加密的，加密规则如下：每位数字都加上5,然后用除以10的余数代替该数字，再将第一位和第四位交换，第二位和第三位交换
要求：从页面输入四位数字，编写函数实现此过程
提示：parseInt()将字符串转换为数字

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <span>输入四位数据：</span><input type="text" id="sj"><input type="button" onclick="encryption()" value="计算">

    <script>
        function encryption(){
            var srt = new Array()
            var jm = document.getElementById("sj").value
            for(i=0;i<jm.length;i++){
                srt[i]=(parseInt(jm[i])+5)%10
            }
            var item
            item = srt[0]
            srt[0]=srt[3]
            srt[3]=item
            item = srt[1]
            srt[1]=srt[2]
            srt[2]=item
            var jg = ""
            for(i=0;i<srt.length;i++){
                jg += srt[i].toString()
            }
            parseInt(jg)
            alert(jg)
        }
    </script>
</body>
</html>

页面加载完成后，将奇数列的li背景色设置为红色，偶数列li背景色设置为绿色。效果如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
        input{
            width: 300px;
            text-align: left;
        }
    </style>
</head>
<body>
    <ul>
        <li><input type="button" name="list" value="li+1"></li>
        <li><input type="button" name="list" value="li+2"></li>
        <li><input type="button" name="list" value="li+3"></li>
        <li><input type="button" name="list" value="li+4"></li>
        <li><input type="button" name="list" value="li+5"></li>
    </ul>

    <script>
        var lis = document.getElementsByName("list")
        for(i=0;i<lis.length;i++){
            if(lis[i].value.match(/\d*[02468]$/)!=null){
                lis[i].style.backgroundColor="red"
            }
            else{
                lis[i].style.backgroundColor="green"
            }
        }
    </script>
</body>
</html>

使用JS完成简易计算器
要求：输入的值只能是数字，使用正则表达式
onchange():值改变时执行事件
onblur():鼠标移出时执行事件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
        select{
            width: 100px;
        }
        form{
            margin-top: 100px;
        }
        input{
            border-color: chartreuse;
        }
    </style>
</head>
<body>
    <center>
        <form>
            <input type="text" id="number1" onKeyPress="if (event.keyCode!=46 && event.keyCode!=45 && event.keyCode<48 || event.keyCode>57) event.returnValue=false" onchange="get_sum()">
            <select id="operator" onchange="get_sum()">
                <option value="1">+</option>
                <option value="2">-</option>
                <option value="3">*</option>
                <option value="4">/</option>
                <option value="5">%</option>
            </select>
            <input type="text" id="number2" onKeyPress="if (event.keyCode!=46 && event.keyCode!=45 && event.keyCode<48 || event.keyCode>57) event.returnValue=false" onchange="get_sum()">
            <span>=</span>
            <input type="text" id="result">
            <br><br>
            <input type="button" id="bt_result" value="计算" onclick="get_sum()">
        </form>
    </center>
    <script> 
        function get_sum(){
            var num1 = Number(document.getElementById("number1").value)
            var num2 = Number(document.getElementById("number2").value)
            var oper = document.getElementById("operator").value
            var item = 0
            switch(oper){
                case "1":
                    item = (value=num1+num2).toFixed(3)
                    document.getElementById("result").value=item
                    break
                case "2":
                    item = (value=num1-num2).toFixed(3)
                    document.getElementById("result").value=item
                    break
                case "3":
                    item = (value=num1*num2).toFixed(3)
                    document.getElementById("result").value=item
                    break
                case "4":
                    item = (value=num1/num2).toFixed(3)
                    document.getElementById("result").value=item
                    break
                case "5":
                    item = (value=num1%num2).toFixed(3)
                    document.getElementById("result").value=item
                    break
            }
        }
    </script>
</body>
</html>