Javascript Start to Finish: Operators

Most commonly used JavaScript operators are listed below:

+ Addition

- Subtraction

* Multiplication

** Exponentiation

/ Division

% Modulus (Remainder)

++ Increment

-- Decrement

Mathematical operators.

Operators follow same general rules as mathematical operators.

Here is the code that shows how to use mathematical operators using JavaScript.

RESULT SHOULD LOOK LIKE THIS: (Code follows below the image)

<!DOCTYPE html>

<html>

<body>

<h2>Most Commonly Used Javascript Operators</h2>

<label id="lblEqualTo">Result:</label><br><br>

<br>

<button id="btnOperator" onclick="jsAdd();">Add Numbers</button><br><br>

<button id="btnOperator" onclick="jsSubtract();">Subtract Numbers</button><br><br>

<button id="btnOperator" onclick="jsMultiply();">Multiply Numbers</button><br><br>

<button id="btnOperator" onclick="jsDivide();">Divide Numbers</button><br><br>

<button id="btnOperator" onclick="jsModulus();">Modulus</button><br><br>

<button id="btnOperator" onclick="jsIncrementing();">Incrementing</button><br><br>

<button id="btnOperator" onclick="jsDecrementing();">Decrementing</button><br><br>

<button id="btnOperator" onclick="jsExponentiation();">Exponentiation</button><br><br>

<button id="btnOperator" onclick="jsExponentiationUsingPow();">ExponentiationUsingPow</button>

<br>

function jsAdd(){

var x = parseInt(document.getElementById("lblNumberOne").value);

var y = parseInt(document.getElementById("lblNumberTwo").value);

var z = x + y;

document.getElementById("lblResult").innerHTML = z;

}

function jsSubtract(){

var x = parseInt(document.getElementById("lblNumberOne").value);

var y = parseInt(document.getElementById("lblNumberTwo").value);

var z = x - y;

document.getElementById("lblResult").innerHTML = z;

}

function jsMultiply(){

var x = parseInt(document.getElementById("lblNumberOne").value);

var y = parseInt(document.getElementById("lblNumberTwo").value);

var z = x * y;

document.getElementById("lblResult").innerHTML = z;

}

function jsDivide(){

var x = parseInt(document.getElementById("lblNumberOne").value);

var y = parseInt(document.getElementById("lblNumberTwo").value);

var z = x / y;

document.getElementById("lblResult").innerHTML = z;

}

function jsModulus(){

var x = parseInt(document.getElementById("lblNumberOne").value);

var y = parseInt(document.getElementById("lblNumberTwo").value);

var z = x % y;

document.getElementById("lblResult").innerHTML = z;

}

function jsDivide(){

var x = parseInt(document.getElementById("lblNumberOne").value);

var y = parseInt(document.getElementById("lblNumberTwo").value);

var z = x / y;

document.getElementById("lblResult").innerHTML = z;

}

function jsIncrementing(){

var x = parseInt(document.getElementById("lblNumberOne").value);

x++;

var z = x;

document.getElementById("lblResult").innerHTML = z;

}

function jsDecrementing(){

var x = parseInt(document.getElementById("lblNumberOne").value);

x--;

var z = x;

document.getElementById("lblResult").innerHTML = z;

}

function jsExponentiation(){

var x = parseInt(document.getElementById("lblNumberOne").value);

var z = x ** 2;

document.getElementById("lblResult").innerHTML = z;

}

function jsExponentiationUsingPow(){

var x = parseInt(document.getElementById("lblNumberOne").value);

var z = Math.pow(x,2);

document.getElementById("lblResult").innerHTML = z;

}

</script>

</body>

</html>

Assignment Operators: Same mathematical operator using assignment operators

HTML CODE:

<!DOCTYPE html>

<html>

<body>

<h2>The Assignment Operators</h2>

<label id="lblEqualTo">Result:</label>

<button id="btnSubtract" onclick="jsSubtract();">Subtract</button><br><br>

<button id="btnMultiply" onclick="jsMultiply();">Multiply</button><br><br>

<button id="btnDivide" onclick="jsDivide();">Divide</button><br><br>

<button id="btnRemainder" onclick="jsRemainder();">Remainder</button><br><br>

JAVASCRIPT CODE:

function jsAdd(){

var x = parseInt(document.getElementById("lblNumberOne").value);

x += parseInt(document.getElementById("lblNumberTwo").value);

document.getElementById("lblResult").innerHTML = x;

}

function jsSubtract(){

var x = parseInt(document.getElementById("lblNumberOne").value);

x -= parseInt(document.getElementById("lblNumberTwo").value);

document.getElementById("lblResult").innerHTML = x;

}

function jsMultiply(){

var x = parseInt(document.getElementById("lblNumberOne").value);

x *= parseInt(document.getElementById("lblNumberTwo").value);

document.getElementById("lblResult").innerHTML = x;

}

function jsDivide(){

var x = parseInt(document.getElementById("lblNumberOne").value);

x /= parseInt(document.getElementById("lblNumberTwo").value);

document.getElementById("lblResult").innerHTML = x;

}

function jsRemainder(){

var x = parseInt(document.getElementById("lblNumberOne").value);

x %= parseInt(document.getElementById("lblNumberTwo").value);

document.getElementById("lblResult").innerHTML = x;

}

</script>

</body>

</html>

Javascript Start to Finish

Pages

Operators

No comments:

Post a Comment

Date Object