Inner.HTML shown of result flicker

Question

function BMI(){
var h = document.getElementById('height').value;
var w = document.getElementById('weight').value;

  var bmi= w/(h/100*h/100);
  var bmi2 = (bmi.toFixed(2));

document.getElementById("result").innerHTML = " your BMI is " + bmi2;

}

why the output of "result" is flickering

Answer 1

You should convert the String into Number because in Javascript when you try to get the value from an input it is in String by default. And use template literals instead of concatenating the Strings.

function BMI(event){
  event.preventDefault();
  var h = Number(document.getElementById('height').value);
  var w = Number(document.getElementById('weight').value);

  var bmi= w/(h/100*h/100);
  var bmi2 = (bmi.toFixed(2));

  document.getElementById("result").innerHTML = `Your BMI is ${bmi2}`;

}