Question

我正在w3school.com上玩，虽然我可以让（*），（/）之类的运算符工作，但我无法使加法或减法运算符起作用。

例如，在链接中：

var x = document.getElementById("myNumber").value;
var y = x * 2
document.getElementById("demo").innerHTML = y;

将导致x是次数2.
但是当我尝试使用

时

+ or -

结果将是x加2的结果。或者如果x是2，则如下所示。

x被视为对象吗？

Answer 1

不，x是字符串。

＆＃13;

var input = document.querySelector('input');
var value = input.value;
console.log(value, typeof value);

＆＃13;

<input type="text" value="2" />

＆＃13;

由于+也用于字符串连接，JS的设计者决定在这种情况下，它会处理任何实际的数字，如字符串并连接它们。

＆＃13;

var input = document.querySelector('input');
var value = input.value + 2; // Basically turns in to "2" + "2"
console.log(value, typeof value);

＆＃13;

<input type="text" value="2" />

＆＃13;

然而，这并不适用于-：

＆＃13;

var input = document.querySelector('input');
var value = input.value - 2; // Equivalent to 2 - 2 === 0
console.log(value, typeof value);

＆＃13;

<input type="text" value="2" />

＆＃13;

所以你需要做的是将字符串转换为数字。我个人最喜欢的是使用Number功能：

＆＃13;

var input = document.querySelector('input');
var value = Number(input.value) + 2;
console.log(value, typeof value);

＆＃13;

<input type="text" value="2" />

＆＃13;

如果您想要非浮点值和/或想要指定基数，您还可以使用功能上等同于Number的{{3}}或parseFloat。

Answer 2

如评论中所述，x是一个字符串，因此+运算符将字符串2添加到您的x字符串中。尝试将其解析为整数以安全地执行数学运算。

var x = parseInt(document.getElementById("myNumber").value, 10);
var y = x + 2
document.getElementById("demo").innerHTML = y;