js實現(xiàn)網(wǎng)頁的兩個input標簽內(nèi)的數(shù)值加減(示例代碼)
更新時間：2017年08月15日 09:04:01 投稿：jingxian
下面小編就為大家?guī)硪黄猨s實現(xiàn)網(wǎng)頁的兩個input標簽內(nèi)的數(shù)值加減(示例代碼)。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
實例如下所示：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script>
window.onload=function(){
var oIput1=document.getElementById('put1');
var oIput2=document.getElementById('put2');
var nAdd=document.getElementById('add');
var nSub=document.getElementById('subtraction');
nAdd.onclick=function(){
var a=Number(oIput1.value);
var b=Number(oIput2.value);
c = a+b;
alert(c);
}
nSub.onclick=function(){
var a=Number(oIput1.value);
var b=Number(oIput2.value);
c = a-b;
alert(c);
}
}
</script>
</head>
<body>
數(shù)值1:<input id="put1" type="text" value=""/>
數(shù)值2：<input id="put2" type="text" value=""/>
<input type="button" id="add" value="求和" />
<input type="button" id="subtraction" value="相減" />
</body>
</html>
下面是效果圖 ↓
以上這篇js實現(xiàn)網(wǎng)頁的兩個input標簽內(nèi)的數(shù)值加減(示例代碼)就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關文章
IE6、IE7中獲取Button元素的值的bug說明，大家在以后使用dom操作的朋友可以注意下。2011-08-08
微信小程序分享小程序碼的生成（帶參數(shù)）以及參數(shù)的獲取
這篇文章主要介紹了微信小程序分享小程序碼的生成（帶參數(shù)）以及參數(shù)的獲取，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2020-03-03
這篇文章主要介紹了關于javascript模塊加載技術的一些思考 ,需要的朋友可以參考下2014-11-11
這篇文章主要介紹了JS數(shù)組方法reverse()用法,結合實例形式分析了JS數(shù)組reverse()方法基本功能、用法與操作注意事項,需要的朋友可以參考下2020-01-01
強大的JavaScript響應式圖表Chartist.js的使用
本篇文章主要介紹了強大的JavaScript響應式圖表Chartist.js的使用，具有一定的參考價值，有興趣的可以了解一下2017-09-09
js模仿windows桌面圖標排列算法具體實現(xiàn)(附圖)
需要引入Jquery，如果需要全部功能，請引入jquery-ui和jquery-ui.css，具體實現(xiàn)步驟如下，感興趣的朋友可以參考下哈2013-06-06
這篇文章主要給大家介紹了關于如何利用Proxy更優(yōu)雅地處理異常的相關資料,文中通過實例代碼以及圖文介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下2022-03-03
如何在?xHTML?中驗證?noscript+meta?refresh?標簽
這篇文章主要介紹了如何在?xHTML?中驗證?noscript+meta?refresh?標簽,需要的朋友可以參考下2023-03-03
這篇文章主要介紹了微信小程序?qū)崟r聊天支持圖片預覽，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2019-05-05
在javascript變量中可以存放兩種類型的值：原始值和引用值。原始值存儲在棧上的簡單字段，也就是值直接存儲在變量所標示的位置內(nèi)。2011-09-09