使用JavaScript在DOM對象上執行算術的正確方法是什麼？

我一直在嘗試使用下面的代碼從段落標記內的值加1，但只得到NaN的作爲輸出值：使用JavaScript在DOM對象上執行算術的正確方法是什麼？

<p id="myNumber">5</p> 
<button onclick="increment()">Click</button> 

<script> 
function increment() { 
    document.getElementById("myNumber").innerHTML = document.getElementById("myNumber").value + 1; 
} 
</script>

誰能說這是爲什麼輸出喃？

來源

2016-09-23 John Smith

1.使用外部事件。（'addEventListener'）2.它是'NaN'，因爲DOM元素值，'innerHTML'（這裏不使用'innerHTML'，你不操作html，使用'textContent'），文本值等是字符串。 3.你需要用'parseInt'，'Number（）'或甚至一元轉換將它們解析爲數字。 –

這是NaN，因爲<p>元素的.value是不確定的。因此你這樣做：

undefined + 1

這是NaN。根據結構使用.textContent或.innerHTML獲取元素的值，然後使用parseInt。

function increment() { 
    document.getElementById("myNumber").textContent = parseInt(document.getElementById("myNumber").textContent,10) + 1; 
}

來源

2016-09-23 23:35:59

'textContent'>'innerText' –

@SterlingArcher - 是的，輕微的失誤:)編輯修復。 –

這就是我知道並喜歡的特拉維斯：D –

您需要的myNumber的innerText（String）屬性解析成整數：

document.getElementById("myNumber").innerText = parseInt(document.getElementById("myNumber").innerText) + 1;

來源

2016-09-23 23:35:37 jrbedard

使用JavaScript在DOM對象上執行算術的正確方法是什麼？

回答

相關問題