javascript - 使用 Javascript 的计分器

Question

我对 Javascript 很陌生，我想为我的一个简单项目制作一个得分计数器函数。我使用了 2 个具有相同目的的函数来实现此目的，但我想为 2 个团队使用相同的函数。我将把代码放在这里。

var scr1 = document.getElementById('button1');
var scr2 = document.getElementById('button2');
var i = 1;

function buttonClick() {
  document.getElementById('inc', 'inc2').value = i++;
}

<div id="scorebox1">
  <button id="button1" onclick="buttonClick()">+1 Team 1 </button>
  <input type="text" id="inc" value="0"> </input>
</div>


<div id="scorebox2">
  <button id="button2" onclick="buttonClick()">+1 Team 2</button>
  <input type="text" id="inc2" value="0"></input>
</div>

我对函数和参数完全陌生，我已经在谷歌上搜索了很长时间的术语，但真的不知道如何前进。我们将不胜感激。

干杯和感谢，J.

Answer 1

使用现有代码，您可以将目标的标识符从按钮传递到函数中

onclick="buttonClick('inc')

并直接增加目标值

document.getElementById(target).value++;

我删除了下面示例中的冗余代码，仅显示相关代码。

function buttonClick(target) {
  document.getElementById(target).value++;
}

<div id="scorebox1">
  <button id="button1" onclick="buttonClick('inc')">+1 Team 1 </button>
  <input type="text" id="inc" value="0"> </input>
</div>


<div id="scorebox2">
  <button id="button2" onclick="buttonClick('inc2')">+1 Team 2</button>
  <input type="text" id="inc2" value="0"></input>
</div>