Si los dos números vienen recogidos por las variables x e y, al poner x+y lo que hará es concatenar sus valores. Si los valores son x=2, y=3, el resultado de sumar x+y no será 5, será 23, ya que concatena. Para evitar ese problema se ha de usar:
- parseInt si se trata de números enteros
- parseFloat si se trata de números con decimales
En nuestro caso para sumar x e y usaremos la siguiente expresión.
suma=parseFloat(x)+parseFloat(y)
Veamos el código para realizar la suma de dos números.
<!DOCTYPE html>
<html>
<body>
<h1>Sumar dos números</h1>
<p>Por favor, introduce dos números:</p>
<input id="num1"><br>
<input id="num2">
<button type="button" onclick="myFunction()">Sumar</button>
<p id="sumando"></p>
<script>
function myFunction() {
var x,y,suma,text;
x = document.getElementById("num1").value;
y = document.getElementById("num2").value;
if (isNaN(x) || isNaN(y)) {
text = "Es necesarios introducir dos números válidos";
} else {
//si no ponemos parseFloat concatenaría x con y
suma=parseFloat(x)+parseFloat(y);
text= suma;
}
document.getElementById("sumando").innerHTML = text;
}
</script>
</body>
</html>
Podemos ver el resultado en el siguiente enlace.
