純js代碼實(shí)現(xiàn)簡(jiǎn)單計(jì)算器
本文實(shí)例分享了純js代碼實(shí)現(xiàn)簡(jiǎn)單計(jì)算器代碼,相信大家會(huì)喜歡。具體如下:
運(yùn)行效果截圖如下:

具體代碼如下:
<!DOCTYPE html>
<html>
<head>
<title> new document </title>
<script type="text/javascript">
function count(){
var txt1 = parseInt( document.getElementById('txt1').value);//獲取第一個(gè)輸入框的值
var txt2 = parseInt( document.getElementById('txt2').value);//獲取第二個(gè)輸入框的值
var select = document.getElementById('select').value;//獲取選擇框的值
var result = '';
switch (select)
{
case '+':
result = txt1 + txt2;
break;
case '-':
result = txt1 - txt2;
break;
case '*':
result = txt1 * txt2;
break;
case '/':
result = txt1 / txt2;
break;
}
document.getElementById('fruit').value = result;//設(shè)置結(jié)果輸入框的值
}
</script>
</head>
<body>
<input type='text' id='txt1' />
<select id='select'>
<option value='+'>+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
</select>
<input type='text' id='txt2' />
<input type='button' value=' = ' onclick = "count()" /> <!--通過(guò) = 按鈕來(lái)調(diào)用創(chuàng)建的函數(shù),得到結(jié)果-->
<input type='text' id='fruit' />
</body>
</html>
復(fù)制粘貼上方代碼即可實(shí)現(xiàn)簡(jiǎn)單的計(jì)算器功能,希望本文所述對(duì)大家學(xué)習(xí)javascript程序設(shè)計(jì)有所幫助。
相關(guān)文章
javascript 新聞標(biāo)題靜態(tài)分頁(yè)代碼 (無(wú)刷新)
一個(gè)模板,從數(shù)據(jù)庫(kù)取n條記錄,生成靜態(tài)。做單頁(yè)面的靜態(tài)化,索引頁(yè)面是用JS對(duì)數(shù)組進(jìn)行組合的。2010-03-03
JavaScript @umijs/plugin-locale插件使用教程
這篇文章主要介紹了JavaScript @umijs/plugin-locale插件使用,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2022-12-12
淺談js圖片前端預(yù)覽之filereader和window.URL.createObjectURL
下面小編就為大家?guī)?lái)一篇淺談js圖片前端預(yù)覽之filereader和window.URL.createObjectURL。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-06-06
Javascript String對(duì)象擴(kuò)展HTML編碼和解碼的方法
Javascript String對(duì)象擴(kuò)展HTML編碼和解碼的代碼2009-06-06
JavaScript實(shí)現(xiàn)簡(jiǎn)單圖片輪播效果
這篇文章主要介紹了JavaScript實(shí)現(xiàn)簡(jiǎn)單圖片輪播效果,點(diǎn)擊下標(biāo)切換到該圖片上,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-08-08
Bootstrap Paginator分頁(yè)插件使用方法詳解
這篇文章主要為大家詳細(xì)介紹了Bootstrap Paginator分頁(yè)插件使用方法,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-05-05
javascript實(shí)現(xiàn)點(diǎn)擊按鈕讓DIV層彈性移動(dòng)的方法
這篇文章主要介紹了javascript實(shí)現(xiàn)點(diǎn)擊按鈕讓DIV層彈性移動(dòng)的方法,實(shí)例分析了javascript操作div層的操作技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-02-02
javascript實(shí)現(xiàn)youku的視頻代碼自適應(yīng)寬度
這篇文章主要介紹了javascript實(shí)現(xiàn)youku的視頻代碼自適應(yīng)寬度的方法的示例,十分的簡(jiǎn)單實(shí)用,有需要的小伙伴可以參考下。2015-05-05
JavaScript對(duì)數(shù)組進(jìn)行隨機(jī)重排的方法
這篇文章主要介紹了JavaScript對(duì)數(shù)組進(jìn)行隨機(jī)重排的方法,實(shí)例分析了javascript實(shí)現(xiàn)數(shù)組隨機(jī)重新排序的兩種實(shí)現(xiàn)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-07-07

