morjar.blogg.se

Var p = document.getElementById("result").value ĭocument.getElementById("result").value = q It returns the evaluated result of the mathematical expression. Note: The eval() function is used in JavaScript to evaluate the expression passed to it as a parameter. The evaluated value of the expression is again assigned to the result. The calculate() function accesses the DOM using the id of the result and evaluates the expression using the eval() function. The clearScreen() function access the DOM using the id of the result and clear its value by assigning it an empty string.ĭocument.getElementById("result").value = "" ĭisplay() function accesses the DOM using the id of the result and appends the value of the clicked button to the result.ĭocument.getElementById("result").value += value

The clearScreen(), display(), and calculate() functions are used to add functionality to the Calculator. Related: How to Use CSS box-shadow: Tricks and Examples is used to import the Orbitron font-family from Google fonts. button class selectors are used to style table structure, the display screen, and buttons of the calculator respectively. class selector is used for selecting elements with a specific class attribute. The above CSS is used to style the calculator. moz-box-shadow: inset 0px 0px 5px #c1c1c1 webkit-box-shadow: inset 0px 0px 5px #c1c1c1

Related: Simple CSS Code Examples You Can Learn in 10 Minutes url('') īox-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px Open the styles.css file and paste the following code:

Each tag contains tags (Table Data) which holds the display screen and buttons of the calculator. The structure of the calculator is created using the tag. The tag contains five rows which represent five horizontal sections of the calculator. Simple Calculator using HTML, CSS and JavaScript Related: Steps to Understanding Basic HTML Code Open the index.html file and paste the following code: