求余数联系和赋值运算

news2025/7/18 7:57:11

算术和赋值运算符

算术运算符： +(加)、 -(减)、 *(乘)、 /(除)、 %(求余)
赋值运算符：=、 +=、 -=、 *=、 /=、 %=

加法运算代码及效果

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>加法运算</title>
    <script type="text/javascript">
        window.onload = function () {
            let oInput01 = document.getElementById('input01');
            let oInput02 = document.getElementById('input02');
            let oBtn = document.getElementById('btn');

            //使用行间事件调用函数，达成点击按钮进行运算
            oBtn.onclick = function () {

            //先获取输入框的值然后进行运算
            // parseInt将文本转化成数字进行运算，如果没有转化，运算就是数字拼接
            let iValue01 = parseInt(oInput01.value);
            let iValue02 = parseInt(oInput02.value);
            alert(iValue01 + iValue02);
            }
        }

    </script>
</head>
<body>
<input type="text" name="" id="input01">+
<input type="text" name="" id="input02">
<input type="button" name="" value="提交" id="btn">
</body>
</html>

在这里插入图片描述

求余数练习及效果

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>求余数</title>
    <script type="text/javascript">
        let iNum01 = 11;
        let iNum02 = 2;

        alert(iNum01%iNum02);//求余数，除不尽的数为余数 
        
    </script>
</head>
<body>

</body>
</html>

在这里插入图片描述

赋值运算代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>赋值运算</title>
    <script type="text/javascript">
        iNum01 = 12;
     // iNum01 = iNum01+2;可以简写为以下代码
        iNum01 += 2;
        alert(iNum01);//弹出14

     // iNum01 = iNum01-5;可以简写为以下代码
        iNum01 -= 5;
        alert(iNum01);//弹出9

     // iNum01 = iNum01*2;可以简写为以下代码
        iNum01 *= 2;
        alert(iNum01);//弹出18

     // iNum01 = iNum01/2;可以简写为以下代码
        iNum01 /= 2;
        alert(iNum01);//弹出9

     // iNum01 = iNum01%2;可以简写为以下代码
        iNum01 %= 2;
        alert(iNum01);//弹出1

    </script>
</head>
<body>

</body>
</html>