Dado un documento HTML que contiene campos de entrada que contienen el lado del triángulo, es decir, lado1, lado2 y lado 3. La tarea es encontrar el área del triángulo usando JavaScript.
Enfoque: Primero crearemos tres campos de entrada usando la etiqueta <input type=”number”> para contener la entrada de números. Después de completar el valor de entrada, cuando el usuario haga clic en el botón, se llamará a la función de JavaScript Area().
En la función JavaScript, usamos document.getElementById(“side1”).value para obtener el valor de entrada y luego aplicamos el método parseInt() para obtener el valor de entrada en número. Y luego use una fórmula matemática simple para encontrar el área del triángulo y use document.getElementById («display»).innerHTML para mostrar la salida en la pantalla.
Fórmula para encontrar el área del triángulo:
var s = (side1 + side2 + side3) / 2; var area = Math.sqrt(s * ((s - side1) * (s - side2) * (s - side3)));
Ejemplo:
HTML
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type"
content="text/html; charset=utf-8">
<title>
JavaScript function to find
the area of a triangle
</title>
</head>
<body style="text-align: center;">
<h1 style="color: green;">
GeeksforGeeks
</h1>
<h4>
JavaScript function to find
the area of a triangle
</h4>
<label for="side1">
Enter the value of side 1:
</label>
<input type="number" id="side1"
placeholder="Enter value of side 1">
<br><br>
<label for="side2">
Enter the value of side 2:
</label>
<input type="number" id="side2"
placeholder="Enter value of side 2">
<br><br>
<label for="side3">
Enter the value of side 3:
</label>
<input type="number" id="side3"
placeholder="Enter value of side 2">
<br><br>
<button onclick="Area()">Click Here!</button>
<p>
Area of Triangle: <span id="display"></span>
</p>
<script type="text/javascript">
function Area() {
var side1 = parseInt(document
.getElementById("side1").value);
var side2 = parseInt(document
.getElementById("side2").value);
var side3 = parseInt(document
.getElementById("side3").value);
console.log(typeof(side1));
var s = (side1 + side2 + side3) / 2;
var area = Math.sqrt(s * ((s - side1)
* (s - side2) * (s - side3)));
document.getElementById(
"display").innerHTML = area;
}
</script>
</body>
</html>
Producción:
