递增和递减

Question

我想为增量和减量值制作2个按钮.因此,如果我增加var k = 4的值并按下减量按钮,它会减小4到3的值

我试过这个

var k = 1;

function qtrFunction(k, v) {
  document.getElementById('qtrrr').innerHTML = k;
  k++;
  document.getElementById('qtrrr').innerHTML = v;
  v--;
}
v = k;
console.log(k);

<div style="color:white; font-size:70px;">QTR <span id="qtrrr" style="color:green; border-radius:10px; padding:5px 20px 5px 20px;">0</span>
</div>


<button onclick="qtrFunction(k)" style="padding:15px">Increase Quart</button>
<button onclick="qtrFunction(v)" style="padding:15px">Decrease Quart</button>

Answer 1

• 避免使用,innerHTML因为它触发了设置值字符串的解析,这是一个昂贵的操作(虽然它比它好document.write).考虑.textContent改为设置.
• 您尚未声明v本地,因此您将收到有关未定义符号的错误.
• 您不需要两个值.

像这样:

<script type="text/ecmascript">
    var value = 0; // initialize a global variable

    function updateAndDisplay(increment) {
        if( increment ) value++;
        else            value--;
        document.getElementById('qtrrr').textContent = value;
    }
</script>

<button onclick="updateAndDisplay(true)" style="padding:15px">Increase Quart</button>
<button onclick="updateAndDisplay(false)" style="padding:15px">Decrease Quart</button>