純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)文章
JS中數(shù)組實(shí)現(xiàn)代碼(倒序遍歷數(shù)組,數(shù)組連接字符串)
這篇文章主要介紹了JS中數(shù)組實(shí)現(xiàn)代碼(倒序遍歷數(shù)組,數(shù)組連接字符串),代碼簡(jiǎn)單易懂,非常不錯(cuò),具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-12-12js實(shí)現(xiàn)千分符和保留幾位小數(shù)的簡(jiǎn)單實(shí)例
下面小編就為大家?guī)?lái)一篇js實(shí)現(xiàn)千分符和保留幾位小數(shù)的簡(jiǎn)單實(shí)例。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-08-08解決layer.open彈出框不能獲取input框的值為空的問(wèn)題
今天小編就為大家分享一篇解決layer.open彈出框不能獲取input框的值為空的問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2019-09-09微信小程序配置服務(wù)器提示驗(yàn)證token失敗的解決方法
這篇文章主要介紹了微信小程序配置服務(wù)器提示驗(yàn)證token失敗的解決方法,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2019-04-04FullCalendar日歷插件應(yīng)用之?dāng)?shù)據(jù)展現(xiàn)(一)
fullcalendar作為一個(gè)功能完善的日歷插件使用非常廣泛,在web開(kāi)發(fā)開(kāi)發(fā)過(guò)程 中非常流行。它與ext js 中的calendar非常類似,但考慮到extjs 比較“復(fù)雜龐大”,所以我在開(kāi)發(fā)開(kāi)發(fā)過(guò)程中都會(huì)優(yōu)先考慮fullcalendar2015-12-12關(guān)于JS中match() 和 exec() 返回值和屬性的測(cè)試
這篇文章主要介紹了關(guān)于JS中match() 和 exec() 返回值和屬性的測(cè)試 的相關(guān)資料,需要的朋友可以參考下2016-03-03document.documentElement的一些使用技巧
documentElement 屬性可返回文檔的根節(jié)點(diǎn),接下來(lái)為大家詳細(xì)介紹下document.documentElement的一些使用技巧,感興趣的朋友可以參考下哈2013-04-04javascript改變position值實(shí)現(xiàn)菜單滾動(dòng)至頂部后固定
現(xiàn)在很多網(wǎng)站都有這樣的一個(gè)效果,當(dāng)頁(yè)面滾動(dòng)到一定高度時(shí),菜單欄會(huì)固定在頁(yè)面頂部;該效果在 ie6 下不支持,因?yàn)閕e6不支持 position:fixed,效果很不錯(cuò),感興趣的朋友可以了解下啊2013-01-01非??犰诺腂ootstrap圖片輪播動(dòng)畫(huà)
這篇文章主要為大家分享了非常酷炫的Bootstrap圖片輪播動(dòng)畫(huà),幾行jQuery和animate.css庫(kù)用在基本的Bootstrap輪播組件中,感興趣的小伙伴們可以參考一下2016-05-05