let a = document.querySelector('#b1').value;
console.log(`a: ${a}`);
document.querySelector('#b1').value = 10;
console.log(`a: ${a}`);
As said in the comments,
When you do let a = document.querySelector('#b1').value; it will parse the value and save it in the variable a.
So doing so, it won't be updated. To get the actual value, you'll need to get it every time.
Like so :
let wrongWay = document.getElementById("foo").value; // Getting it the wrong way
let rightWay = document.getElementById("foo"); // Getting it the right way
console.log("wrong way value : " + wrongWay);
console.log("right way value : " + rightWay.value);
// Changing input value
document.getElementById("foo").value = "new value";
console.log("Changed value !");
console.log("wrong way value : " + wrongWay); // The value isn't updated as it is saved as a string -> so it didn't get any update
console.log("right way value : " + rightWay.value); // By getting it, you are sure to get the right value<input id="foo" type="text" value="old value" >