爲什麼我在輸入字段中輸入數字並將其與數學結合時會得到NaN？

Question

我想計算所有邊的體積和長度，但是當我在提示中輸入數字時，我得到了NaN。爲什麼它不工作？

var length = document.getElementById("length"); 
 
var answer = document.getElementById("answer"); 
 
var sides = document.getElementById("sides"); 
 

 

 
var side = prompt("Enter the length/height/width of your cube", 2); 
 

 

 

 
length.innerText = side; 
 

 

 
var volume = Math.pow(side,3); 
 
var sidesmax = length*12; 
 
answer.innerText = volume; 
 
answer.innerText = sidesmax;

<p> 
 
One side of your cube has a measurement of <span id="length">___</span> units. 
 
</p> 
 
<p> 
 
Your cube has a volume of <span id="answer">___</span> units cubed. 
 
</p> 
 
<p> 
 
Your cube has max side length of <span id="answer">___</span>. 
 
</p>

Answer 1

所以你有一些錯誤。

這條線：

var sidesmax = length*12; 

應該是這樣的：

var sidesmax = side * 12; 

這些線都使用相同的元素，稱爲answer：

answer.innerText = volume; 
answer.innerText = sidesmax; 

使用不同的ID爲兩個跨併爲它們分開變量。

對於小的整數次冪，通常使用*而不是使用Math.pow，雖然二者將工作：

var volume = side * side * side; 

還要注意變量side包含一個字符串，而不是數字。對於涉及*或Math.pow的操作，這並不重要，因爲自動類型強制會將其轉換爲您，但如果您嘗試使用其他操作符（例如+），它將被視爲字符串。

var length = document.getElementById("length"); 
 
var sidesAnswer = document.getElementById("sidesAnswer"); 
 
var volumeAnswer = document.getElementById("volumeAnswer"); 
 
var sides = document.getElementById("sides"); 
 

 
var side = prompt("Enter the length/height/width of your cube", 2); 
 

 
length.innerText = side; 
 

 
var volume = side * side * side; 
 
var sidesmax = side * 12; 
 
volumeAnswer.innerText = volume; 
 
sidesAnswer.innerText = sidesmax;

<p> 
 
One side of your cube has a measurement of <span id="length">___</span> units. 
 
</p> 
 
<p> 
 
Your cube has a volume of <span id="volumeAnswer">___</span> units cubed. 
 
</p> 
 
<p> 
 
Your cube has max side length of <span id="sidesAnswer">___</span>. 
 
</p>

Answer 2

問題是這一行var sidesmax = parseInt(length)*12;你是一個字符串（__）乘以12。通過刪除你的文件代碼運行良好。

var length = document.getElementById("length"); 
var answer = document.getElementById("answer"); 
var sides = document.getElementById("sides"); 


var side = prompt("Enter the length/height/width of your cube", 2); 



length.innerText = side; 

console.log(side); 
var volume = Math.pow(side,3); 

// var sidesmax = parseInt(length)*12; // multiplying string with 1 
answer.innerText = volume; 
answer.innerText = sidesmax; 

Answer 3

var length = document.getElementById("length"); 
 
var answer = document.getElementById("answer"); 
 
var sides = document.getElementById("sides"); 
 

 

 
var side = prompt("Enter the length/height/width of your cube", 2); 
 

 

 

 
length.innerText = side; 
 

 

 
var volume = Math.pow(side,3); 
 
var sidesmax = length*12; 
 
answer.innerText = volume; 
 
answer.innerText = sidesmax;

<p> 
 
One side of your cube has a measurement of <span id="length">___</span> units. 
 
</p> 
 
<p> 
 
Your cube has a volume of <span id="answer">___</span> units cubed. 
 
</p> 
 
<p> 
 
Your cube has max side length of <span id="answer">___</span>. 
 
</p>