How can we help?
Didn't find what you were looking for?
New post4 comments
-
I think this is not a place to ask a question like that but here are some of the ways that can help you.
You can create a calculator in HTML using JavaScript and the DOM (Document Object Model) without using any additional JavaScript libraries such as PJs. Here is an example of how you can create a simple calculator:
- First, create the HTML structure for the calculator. This can include a container div, input elements for the numbers and operators, and buttons for the calculator's functions.
<div id="calculator"> <input type="text" id="display" disabled> <br> <button>7</button> <button>8</button> <button>9</button> <button class="operator">+</button> <br> <button>4</button> <button>5</button> <button>6</button> <button class="operator">-</button> <br> <button>1</button> <button>2</button> <button>3</button> <button class="operator">*</button> <br> <button>0</button> <button class="operator">/</button> <button id="equal">=</button> <button id="clear">C</button> </div>- Next, use JavaScript to add event listeners to the buttons and input elements. This will allow you to perform actions, such as displaying the numbers and operators when clicked.
const buttons = document.querySelectorAll('button'); const display = document.querySelector('#display'); buttons.forEach(button => { button.addEventListener('click', e => { const value = e.target.innerText; if (!isNaN(value)) { display.value += value; } else if (value === 'C') { display.value = ''; } else if (value === '=') { display.value = eval(display.value); } else { display.value += value; } }); });- Finally, you can use JavaScript to add the logic for the calculator's functions, such as performing the calculations and displaying the results.
const equal = document.querySelector('#equal'); equal.addEventListener('click', e => { display.value = eval(display.value); });This is a basic example of how you can create a calculator using HTML, JavaScript, and the DOM, without using any additional libraries. You can style the calculator using CSS and add more features like history or memory.
I hope this helps! Next time try to use another website, & let me know if you have any other questions.
Please sign in to leave a comment.