javascript - HTML内で値をインクリメントするにはどうすればよいですか?

Question

私はJavaScriptがまったく初めてです。HTML 内の変数をインクリメントしようとしていますが、機能していません。私の構文は間違っていますか？

<script>
function rps() {
computerScore.value++;
computerScore.innerHTML = computerScore.value;
}
 </script>   
<html>
<b>computer score:</b><p id="computerScore" value="0">-</p>
<button type="button" onclick="rps()">Go</button><br>
</html>

score 14 · Accepted Answer

value<p>タグの有効な属性ではありません。

次のようなものが欲しいと思います：

function rps() {
    var computerScore = document.getElementById('computerScore');
    var number = computerScore.innerHTML;
    number++;
    computerScore.innerHTML = number;
}

...

<b>computer score:</b><p id="computerScore">0</p>

score 1 · Accepted Answer

いくつかの問題:

ほとんどのブラウザーでは、グローバルプロパティとして ID で要素を取得することはできません。
属性は常に要素のプロパティであるとは限りません (値は入力要素のプロパティのみです)

あなたはこれを行うことができます：

function rps() {
   // fetch the element :
   var element = document.getElementById('computerScore'); 

   // get the attribute, parse it and increment it :
   value = parseInt(element.getAttribute('value'), 10)+1; 

   // stores the incremented value :
   element.setAttribute('value', value);

   // and change the innerHTML (conversion to string is implicit)
   element.innerHTML = value;
}

score 0 · Accepted Answer

いくつかの問題:

computerScoreなんでもない; あなたはおそらく欲しいdocument.getElementById('computerScore')
value<p>は有効ではありません。代わりに or 何かを使用data-valueします (または

var computerScore = document.getElementById('computerScore');
function rps() {
    computerScore.dataset.value++;
    computerScore.innerHTML = computerScore.dataset.value;
}

dataset.valueは文字列ですが++、整数に強制されることに注意してください。

http://jsfiddle.net/vqPKZ/

イベント属性ではなくイベントバインディングを使用することもお勧めします。button.addEventLister

score -3 · Accepted Answer

var elm = whatever //assuming you select your element using the DOM
// update value
elm.innerHTML = +elm.innerHTML + 1;

javascript - HTML内で値をインクリメントするにはどうすればよいですか?

5 に答える 5

Related

Reference