<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
button{
width:40px;
height:40px;
font-size:24px;
vertical-align:bottom;
}
#num{
box-sizing:border-box;
height:40px;
width:60px;
font-size:24px;
text-align:center;
}
</style>
</head>
<body>
<div>
<button onclick="btnOperate('-')">-</button>
<input id="num" value="1">
<button onclick="btnOperate('+')">+</button>
</div>
<script src="common.js"></script>
<script>
function btnAdd(){
//1、獲取#num的value
var value = document.getElementById("num").value;
//2、將取出來的值做+1操作，再賦值給#num的value
value = Number(value) + 1;
document.getElementById("num").value = value;
}
function btnReduce(){
//1、獲取#num的值
var value = Number(document.getElementById("num").value);
//2、判斷#num的值是否小於等於1，如果小於等於1的話，則將值改為1
//3、否則，可以實現 - 1 操作
if(value <= 1){
value = 1;
}else{
value -= 1;
}
//4、將 value 的值賦值給 #num
document.getElementById("num").value = value;
}
/**
* 做 數值的更改操作
* 參數 op ：表示 符號
*/
function btnOperate(op){
var value = Number($("num").value);
if(op == '+'){
value += 1;
}else if(op == '-'){
if(value <= 1){
value = 1;
}else{
value -= 1;
}
}
$("num").value=value;
}
</script>
</body>
</html>
