Question

我正在努力完成以下事项而且我不知道为什么我会挣扎。创建一个新的小提琴，其中包含一个带有文本＆＃34; x2＆＃34;的按钮。和数字1这样：

1 x2

使用Javascript进行设置，以便每次单击按钮时，x2按钮上方的数字将加倍。发给我小提琴的链接。

这是我到目前为止所拥有的。我知道我通过JS瞄准按钮，但是当单击x2按钮时我无法弄清楚如何返回更新的值。

<p id="counter">1</p>
<button onclick="calc()">x2</button>
<script>
function calc() {
    var element = document.getElementById("counter") *2;
    return counter.innerHTML = element;
}
</script>

Answer 1

看看这段代码在做什么：

var element = document.getElementById("counter") *2;

您将元素乘以2，而不是阅读文本。

您想使用innerHTML或textContent。这会返回一个字符串，因此您要使用parseInt()或parseFloat()。

Answer 2

别回来，没有什么能看到你的回报。把它放回counter元素。此外，document.getElementById("counter") *2会为您提供NaN，因为您将Element个对象乘以数字;你需要处理.textContent值，这是一个字符串（并且在完成算术时会自动转换为数字）。

Answer 3

这是您需要做的事情：

calc()函数需要解决更改元素的innerHTML。然后需要将相同innerHTML的乘法分配给它，但需要先将其转换为数字。没有别的 - 没有return陈述或其他任何内容。

此代码段包含执行此操作的代码（隐藏，因为扰流板，但反正为时已晚）：

＆＃13;

function calc(){
  document.getElementById('counter').innerHTML=Number(document.getElementById('counter').innerHTML)*2;
}

＆＃13;

<p id="counter">1</p>
<button onclick="calc()">x2</button>

＆＃13;

Answer 4

试试这个：

function calc() {
    var newvalue = parseInt(document.getElementById("counter").innerHTML) * 2;
    alert(newvalue);
}

Answer 5

innerHTML实际上会返回字符串而非数字，因此要将其转换为数字，我们需要调用parseInt()：

<p id="counter">1</p>
<button onclick="calc()">x2</button>
<script>
   function calc() {
      var element = parseInt(document.getElementById("counter").innerHTML) * 2;
   return counter.innerHTML = element;
}

单击按钮时，使用Javascript调用并返回值

5 个答案: