javascript - 各ボタンのクリック数と合計を表示

Question

ボタン＃1、ボタン＃2のオンクリック数を表示し、ボタン＃1 +ボタン＃2のクリック数の合計を表示できるようにしたいと考えています。これまでのところ、私が示すことができたのは合計だけです。

HTML

 <button id="1" onclick = "countCar('ferrari');">Button#1</button>
 <a>Ferraris</a><span id="ferrariCount"></span>

 <a id="showSum">SUM<span id="carCount"></span></a>

 <button id="2" onclick = "countCar('toyota');">Button#2</button>
 <a>Toyotas</a><span id="toyotaCount"></span>

Javascript

  var carCount = 0; 
  var ferrariCount = 0;
  var toyotaCount = 0;
  function countCar(type)

  {
    carCount = carCount + 1;
    document.getElementById('carCount').innerHTML = carCount;

    ferrariCount = ferrariCount + 1;
    toyotaCount = toyotaCount + 1;

     if(type =='ferrari'){document.getElementById('ferrariCount').innerHTML = ferrariCount;
             }else{
             document.getElementById('toyotaCount').innerHTML = toyotaCount;}
  };

Answer 1

場合 (タイプ = '1')

なぜこれを使用しているのですか？

に変更する必要があります

if(type === 'ferrari') そしてそれはうまくいきます。

また、そのinnerHTMLのいくつかのタイプミス

Answer 2

あなたのコードは少し冗長なので、次のように構成します。

var counts = {
  'ferrari': 0,
  'toyota': 0,
  'total': 0
};

function countCar(type) {
  document.getElementById('carCount').innerHTML = ++counts['total'];
  document.getElementById(type + 'Count').innerHTML = ++counts[type];
}

大量のグローバル変数を使用する代わりに、作成してオブジェクトを作成し、そこに数値を格納します。これにより、コードがよりクリーンになり、読みやすくなります。

Answer 3

そして変更

document.getElementById('toyotaCount')。interHTML = トヨタカウント;}