*
 border: 1px solid #000
 

.countbox
 width: 200px
 background-color: #333
 color: #fff

.minus,.num,.pulse
 display: inline-block
 font-family: '微軟正黑體'
 font-size: 49px
 padding: 5px
 user-select: none
 
.num
 width: 50px
 text-align: center
 
.minus,.pulse
 cursor: pointer
 
 
.text
 font-family: '微軟正黑體'
 text-align: center
 padding: 5px

var num = 12

// function定義
function check() {
  if (num < 10) {
    $(".text").text("數量極少");

  } else if (num < 20) {
    $(".text").text("賣得不錯喔");

  } else {
    $(".text").text("還剩很多");
  }
}

// 按鈕功能
$(".minus").click(
  function() {
    num = num - 1
    $(".num").text(num);
    check();
  }

);

$(".pulse").click(
  function() {
    num = num + 1
    $(".num").text(num);
    check();

  }

);

jQuery簡化

var num = 12

// function定義
function check() {
  if (num < 10) {
    $(".text").text("數量極少");

  } else if (num < 20) {
    $(".text").text("賣得不錯喔");

  } else {
    $(".text").text("還剩很多");
  }
}

// 按鈕功能
function click(num_var) {
  num = num + num_var
}

$(".minus").click(
  function() {
    click(-1);
    check();
  }

);

$(".pulse").click(
  function() {
    click(1);
    check();

  }

);

Display

return

return可以把結果叫出來

var result;

function add(num1, num2){
    //計算但沒有講出來
    var X = num1 + num2;
    //講出來
    return X;
}
//呼叫函數
result = add(1,2);

迴圈化函數

將相似並且重複多次的函數，寫成一個迴圈

//迴圈前的函數們
$("#0").click(
 function() {
  items[0].number++;
  showlist();
 }
)

$("#1").click(
 function() {
  items[1].number++;
  showlist();
 }
)

$("#2").click(
 function() {
  items[2].number++;
  showlist();
 }
)

$("#3").click(
 function() {
  items[3].number++;
  showlist();
 }
)

$("#4").click(
 function() {
  items[4].number++;
  showlist();
 }
)

$("#5").click(
 function() {
  items[5].number++;
  showlist();
 }
)

//迴圈後
//迴圈後
for(i=;i<6;i++){
 //因為迴圈跑完後，i會消失，所以要再function外面再包一層臨時函數，設定一個臨時參數（參數會保存下來
 var tempFunction=function(tempVar){
  $("#"+tempVar).click(
   function(){
    items[tempVar].number++;
    showlist():
   }
  );
 }
 //然後再把i帶進去臨時函數裡面
 tempFunction(i);
}