用javascript實現(xiàn)簡單計算器
更新時間：2021年08月15日 14:03:49 作者：王者生輝
這篇文章主要為大家詳細介紹了用javascript實現(xiàn)簡單計算器，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下
本文實例為大家分享了javascript實現(xiàn)簡單計算器的具體代碼，供大家參考，具體內(nèi)容如下
設(shè)計一個簡單的計算器
代碼
<body>
<a>第一個數(shù)</a>
<input type="test" id="inputId1" value="" /><br/>
<a>第二個數(shù)</a>
<input type="test" id="inputId2" value="" /><br/>
<button onclick="cal('+')">+</button>
<button onclick="cal('-')">-</button>
<button onclick="cal('*')">*</button>
<button onclick="cal('/')">/</button><br/>
<a>計算結(jié)果</a>
<input type="test" id="resultId" value="" />
<script type="text/javascript">
// function add() {
// console.log('add');
// var inputObj1 = document.getElementById('inputId1');
// var inputObj2 = document.getElementById('inputId2');
// var result = parseInt(inputObj1.value) + parseInt(inputObj2.value);
// var resultObj = document.getElementById('result');
// resultObj.value = result;
// console.log(result);
// }
function cal(type) {
var inputObj1 = document.getElementById('inputId1');
var inputObj2 = document.getElementById('inputId2');
switch(type){
case '+':
var result = parseInt(inputObj1.value) + parseInt(inputObj2.value);
break;
case '-':
var result = parseInt(inputObj1.value) - parseInt(inputObj2.value);
break;
case '*':
var result = parseInt(inputObj1.value) * parseInt(inputObj2.value);
break;
case '/':
var result = parseInt(inputObj1.value) / parseInt(inputObj2.value);
break;
}
var resultObj = document.getElementById('resultId');
resultObj.value = result;
}
</script>
</body>
</html>
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要介紹了javascript背景時鐘實現(xiàn)方法,涉及javascript時間及頁面元素樣式的相關(guān)操作技巧,需要的朋友可以參考下2015-06-06
這篇文章主要給大家介紹了關(guān)于js繼承的6種方式，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-04-04
這篇文章主要介紹了JavaScript中Window對象的屬性及事件 的相關(guān)資料,需要的朋友可以參考下2015-12-12
這篇文章主要介紹了webpack4.x打包過程詳解，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-07-07
微信小程序?qū)崿F(xiàn)搜索功能并跳轉(zhuǎn)搜索結(jié)果頁面
本文主要介紹了微信小程序?qū)崿F(xiàn)搜索功能并跳轉(zhuǎn)搜索結(jié)果頁面，文中通過示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-12-12
這篇文章主要介紹了Object.keys?詭異特性示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-10-10
JS獲取當(dāng)前時間的年月日時分秒及時間的格式化的方法
這篇文章主要介紹了js獲取當(dāng)前時間的年月日時分秒及時間的格式化，本文通過實例代碼講解的非常詳細，具有一定的參考借鑒價值,需要的朋友可以參考下2019-12-12
在文本框中輸入完內(nèi)容后,經(jīng)常需要按回車,焦點跳到下個文本框,或者觸發(fā)按鈕事件2010-06-06
幾款極品的javascript壓縮混淆工具...2007-05-05
JavaScript黑洞數(shù)字之運算路線查找算法(遞歸算法)實例
這篇文章主要介紹了JavaScript黑洞數(shù)字之運算路線查找算法,涉及JavaScript遞歸操作算法相關(guān)技巧,需要的朋友可以參考下2016-01-01