Calculation error in javascript Unknown output "NaN"

Question

Everything is good for me, but the result always appears Nan

this is the code

js

 function myFunction() {
    var x = document.getElementById("myInput").value;
    var str1 = document.getElementById("demo");
    var str2 = document.getElementById("demo2");
    var str3 = document.getElementById("demo3");
    var str4 = x * str2;
    document.getElementById("demo").innerHTML = str4 * str3;

Html

 <p id="demo"></p>
<br>
<p id="demo2">1</p>
<br>
<p id="demo3">1</p>

outpot: Nan

You're trying to multiply a string with a DOM element. The result is not a number (NaN). — Robby Cornelissen, May 25 '20 at 07:18
You use `.value` on some elements but not on others. That should be a hint. — Ivar, May 25 '20 at 07:21

score 0 · Accepted Answer · answered May 25 '20 at 07:25

 function myFunction() {
    var x = document.getElementById("myInput").value;
    var str1 = document.getElementById("demo").innerText;
    var str2 = document.getElementById("demo2").innerText;
    var str3 = document.getElementById("demo3").innerText;
    var str4 = parseInt(x) * parseInt(str2);
    document.getElementById("demo").innerHTML = (parseInt(str4) * parseInt(str3)).toString();
 }

 <p id="demo"></p>
<br>
<p id="demo2">2</p>
<br>
<p id="demo3">10</p>
<input placeholder="enter" id="myInput" type="number" required/>

<input type="button" onClick="myFunction()" value="Calculate"/>

Calculation error in javascript Unknown output "NaN"

1 Answers1