使用所有公式计算三角形面积的Javascript程序

我正在尝试创建一个程序，使用下面的任一公式计算三角形的面积

知道基础和高度
希伯伦"；s公式
知道两边和夹角

我将使用不同功能(公式(的点击按钮，使用提示输入用户数据，但该按钮不会触发提示功能

var baseValue = Number(prompt("Enter the base of the triangle: "));
var heightValue = Number(prompt("Enter the height of the triangle: "));
function formula1(basevalue, heightValue) {
// calculate the area 
var areaValue1 = (baseValue * heightValue) / 2;
return("the area of the triangle is" + areaValue1);
}
var side1 = parseInt(prompt("Enter side1: "));
var side2 = parseInt(prompt("Enter side2: "));
var side3 = parseInt(prompt("Enter side3: "));

function formula2(){
//calculate the semi-parameter
var s = (side1 + side2 + side3) / 2;
//calculate the area
var areaValue2 = Math.sqrt(s * (s - side1) * (s - side2) * (s - side3));
alert("The area of the triangle is " ${areaValue2});
}

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title> Area of a triangle</title>
<h1>Formulas to calculate the area of a triangle</h1>
</head>
<body>
<button id="bgnBtn" onclick="formula1()">Knowing Base and Height<br><br>
<button id="bgnBtn" onclick="formula2()">Heron's Formula</button><br><br>
<button id="bgnBtn" onclick="formula3()">Knowing two sides & an angle</button><br><br>
<script type="text/javascript" scr="Calculator.js"></script>
</body>
</html>

我希望这对你有所帮助。

function formula1() {
var base = parseInt(prompt("Please enter Base In Units"));
var height = parseInt(prompt("Please enter Height In Units"));
let area = base * height / 2;

console.log(area + ' Sq. Units');
document.getElementById('area').innerHTML = ('Area:' + area + ' Sq. Units');
}
function formula2() {
var a = parseInt(prompt("Please enter Side 'I' In Units"));
var b = parseInt(prompt("Please enter Side 'II' In Units"));
var c = parseInt(prompt("Please enter Side 'III' In Units"));
let s = (a + b + c) / 2;
let product = s * (s - a) * (s - b) * (s - c);
if (s <= a || s <= b || s <= c) {
console.log(a, b, c, s);
console.log('invalid Inputs');
return;
}
let area = Math.sqrt(product).toFixed(3);
console.log(area + ' Sq. Units');
document.getElementById('area').innerHTML = ('Area: ' + area + ' Sq. Units');
}
function formula3() {
var a = parseInt(prompt("Please enter Side 'I' In Units"));
var b = parseInt(prompt("Please enter Side 'II' In Units"));
var c = parseInt(prompt("angle made by given lines In deg:"));
c = c * Math.PI / 180;

let z = Math.sin(c);
let area = (0.5 * a * b * z).toFixed(3);
console.log(area + ' Sq. Units');
document.getElementById('area').innerHTML = ('Area: ' + area + ' Sq. Units');
}

<button id="bgnBtn" onclick="formula1()">Knowing Base and Height</button><br><br>
<button id="bgnBtn" onclick="formula2()">Heron's Formula</button><br><br>
<button id="bgnBtn" onclick="formula3()">Knowing two sides & an angle</button><br><br>
<h3 id='area'></h3>

有两个问题，比如一些注释，连接字符串的方式是通过"hello " + variable或`hello ${variable}`，但为了使用$｛｝方法，必须将其放在用``而不是""或''声明的字符串中

下一个问题是，您希望在函数内部声明变量，而不是在函数外部声明变量，因为这是一个提示。例如：

function greetUser() {
var input = prompt("Whats your name?");
alert("Hello " + input);
}

<button onclick="greetUser()"> Greeting </button>

上面的有效，但下面的不

var input = prompt("Whats your name?");
function greetUser() {
alert("Hello " + input);
}

<button onclick="greetUser()"> Greeting </button>

最后一个一开始会询问您的姓名，但当您单击按钮时，它不会再询问您，这意味着您必须重新加载页面才能输入新的输入。

function AreaT() {
let a = parseInt(document
.getElementById("a").value);
let b = parseInt(document
.getElementById("b").value);
let c = parseInt(document
.getElementById("c").value);
console.log(typeof(a));
let s = (a + b + c) / 2;
let area = Math.sqrt(s * ((s - a) 
* (s - b) * (s - c)));
console.log(area)
document.getElementById("display").innerHTML = ( area + 'n'+ 'is the area of trianlge.' );
}

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Solve Area of Triangle</title>
</head>
<body>
<center>
<h1>AREA OF TRIANGLE KNOWING THREE SIDES</h1>
<hr />
<h2>Enter a number in the box .</h2>
<hr />
<br><br>
<button onclick = "AreaT();">Area of Triangle</button>
<br><br>
<label for="a">
Enter Number: 
</label>

<input type="number" id="a" 
placeholder="Input Value">
<br><br>

<label for="b">
Enter Number: 
</label>

<input type="number" id="b" 
placeholder="Input Value">
<br><br>

<label for="c">
Enter Number: 
</label>

<input type="number" id="c" 
placeholder="Input Value">
<br><br>
<p>
<b><span id="display"></span></b>
</p>
</center>

<Script type="text/javascript" src="Function.js"></Script>
</body>
</html>

相关内容

最新更新

热门标签：