Question

我有这个有效的代码：

HTML

Aumentar un <input id="porcentaje">% 
<input type="button" id="aumentar" value="Aumentar" onclick="calcular()">
<br>Monto: <input id="campo">
<br> If you insert a number into the "campo" input it should be aumented 
<br>by the same aumont that says the "porcentaje" input.

JS

function calcular() {
var original = document.getElementById('campo');
var aumento = document.getElementById('porcentaje').value;
original.value = original.value*aumento/100;
}

我不明白为什么这个JS代码有效，而这个代码不适用：

function calcular() {
var original = document.getElementById('campo').value;
var aumento = document.getElementById('porcentaje').value;
original = original*aumento/100;
}

换句话说，为什么我可以使用 var original = document.getElementById（'campo'）; 但它不适用于 var original = document.getElementById（'campo' ） .value ; ？但它确实适用于 var aumento = document.getElementById（'porcentaje'） .value ; 。

我开始学习JS，这个差异让我无法理解。在这两种情况下我都试图达到输入值，但在一种情况下它确实起作用（var aumento）而在另一种情况下它不起作用（var original）。

Answer 1

那是因为

var original = document.getElementById('campo');

获取对输入字段的DOM-Element的引用。它实际上是一个可以在之后被操纵的物体。而

var original = document.getElementById('campo').value;

只获取与输入字段没有连接/绑定的值。

JS：为什么.value在一个案例中起作用但在另一个案例中却没有？

1 个答案: