如何在 JS 中组合这些功能

Question

It's increasing a form value of total votes on star rating. if click 1 star, increases votes +1, if click 5 stars, increases 5. How can i combine them?

    function incrementValue1() {
    var value = parseInt(document.getElementById('ratecount').value, 10);
value = isNaN(value) ? 0 : value;
value++;
    document.getElementById('ratecount').value = value;
}
function incrementValue2() {
    var value = parseInt(document.getElementById('ratecount').value, 10);
value = isNaN(value) ? 0 : value;
value+=2;
    document.getElementById('ratecount').value = value;
}
function incrementValue3() {
    var value = parseInt(document.getElementById('ratecount').value, 10);
value = isNaN(value) ? 0 : value;
value+=3;
    document.getElementById('ratecount').value = value;
}
function incrementValue4() {
    var value = parseInt(document.getElementById('ratecount').value, 10);
value = isNaN(value) ? 0 : value;
value+=4;
    document.getElementById('ratecount').value = value;
}
function incrementValue5() {
    var value = parseInt(document.getElementById('ratecount').value, 10);
value = isNaN(value) ? 0 : value;
value+=5;
    document.getElementById('ratecount').value = value;
}

Answer 1

Pass the increment value as a parameter to one function like:

function incrementValue(amt) {
    var value = parseInt(document.getElementById('ratecount').value, 10);
    value = isNaN(value) ? 0 : value;
    value+=amt;
    document.getElementById('ratecount').value = value;
}

Answer 2

Just add a parameter to the function that indicates how much to increment the value.

function incrementValue(increment) {
    var value = parseInt(document.getElementById('ratecount').value, 10);
    value = isNaN(value) ? 0 : value;
    value += increment;
    document.getElementById('ratecount').value = value;
}
incrementValue(1);//increment by 1
incrementValue(5);//increment by 5

Answer 3

All you need to do is take advantage of parameters in functions , which are data that is passed into the function when it is called. That data (parameter) is available as a local variable within the function.

In this case, you would pass the amount that you need to increment by because everything else in all those functions is the same:

 // You should get your element references just once, not // everytime the function is called: let rateCount = document.getElementById('ratecount'); // This function is declared in a way that makes it // expect some data will be passed to it when it is // invoked and that data will be accessible within // the function using the parameter name defined // by the function declaration (amount in this case) function incrementValue(amount) { var value = parseInt(rateCount.value, 10); value = isNaN(value)? 0: value; value += amount; // Use the passed in amount rateCount.value = value; } incrementValue(16);

 <input id="ratecount">