如果iam使用
console.log(document.getElementById("P1").value);
console.log(document.getElementById("P2").value);
console.log(document.getElementById("H1").value);
获取三个输入（文本）的值。当我使用那些console.log时，它将给我一个很好的答案，即元素。但是，当我想通过id将3 get元素分配给3 vars时，它说的是：对象HTMLInputElement。为什么是这样？这是我的html：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Resterende kracht berekenen</title>
<link rel="stylesheet" href="./Krachten.css">
</head>
<body>
<h2 id="Titel">Vul hier je berekening in:</h2>
Lengte pijl 1 in cm :<br>
<input type="text" id="P1" placeholder="Pijl 1" class="P1"><br>
Lengte pijl 2 in cm :<br>
<input type="text" id="P2" placeholder="Pijl 2" class="P2"><br>
Hoek gemeten in graden :<br>
<input type="text" id="H1" placeholder="Hoek" class="H1">
<br><br><br><button id="btn" type="button" onclick="KB()">Klik om antwoord te berekenen</button>
<script src="./Krachten.js"></script>
<script src="./Dingen voor Main (Niet aankomen)/jquery-3.3.1.min.js"></script>
</body>
</html>
Javascript：
function KB () {
var F1 = 4;
var F2 = 3;
var S = 20;
var H = 60; //in graden, moet naar radians
var F15 = F1 * S;
var F25 = F2 * S;
var F11;
var F21;
var H2 = (Math.PI);
var H3 = (H / 180);
var H4 = (H3 * H2);
var H5 = Math.cos(H4);
var Temp1;
var Temp2;
var Fr2;
berekenen();
function berekenen () {
F11 = F15 * F15;
F21 = F25 * F25;
Temp1 = (2*(F15*F25))
Temp2 = (H5 * Temp1) + (F11 + F21)
Fr2 = (Math.round((Math.sqrt(Temp2))));
console.log(`De kracht die resterend is van deze 2 krachten = ${Fr2} Newton`)
alert(`De kracht die resterend is van deze 2 krachten = ${Fr2} Newton`)
console.log(document.getElementById("P1").value);
console.log(document.getElementById("P2").value);
console.log(document.getElementById("H1").value);
}
};
这些值都是空的。为每个输入设置值，您就可以开始了。或者，您可以在输入框中输入值
function KB () {
var F1 = 4;
var F2 = 3;
var S = 20;
var H = 60; //in graden, moet naar radians
var F15 = F1 * S;
var F25 = F2 * S;
var F11;
var F21;
var H2 = (Math.PI);
var H3 = (H / 180);
var H4 = (H3 * H2);
var H5 = Math.cos(H4);
var Temp1;
var Temp2;
var Fr2;
berekenen();
function berekenen () {
F11 = F15 * F15;
F21 = F25 * F25;
Temp1 = (2*(F15*F25))
Temp2 = (H5 * Temp1) + (F11 + F21)
Fr2 = (Math.round((Math.sqrt(Temp2))));
console.log(`De kracht die resterend is van deze 2 krachten = ${Fr2} Newton`)
alert(`De kracht die resterend is van deze 2 krachten = ${Fr2} Newton`)
console.log(document.getElementById("P1").value);
console.log(document.getElementById("P2").value);
console.log(document.getElementById("H1").value);
console.log(document.getElementById("P1").placeholder);
console.log(document.getElementById("P2").placeholder);
console.log(document.getElementById("H1").placeholder);
}
};<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Resterende kracht berekenen</title>
<link rel="stylesheet" href="./Krachten.css">
</head>
<body>
<h2 id="Titel">Vul hier je berekening in:</h2>
Lengte pijl 1 in cm :<br>
<input type="text" id="P1" placeholder="Pijl 1" value='abc' class="P1"><br>
Lengte pijl 2 in cm :<br>
<input type="text" id="P2" placeholder="Pijl 2" value='def' class="P2"><br>
Hoek gemeten in graden :<br>
<input type="text" id="H1" placeholder="Hoek" value='ghi' class="H1">
<br><br><br><button id="btn" type="button" onclick="KB()">Klik om antwoord te berekenen</button>
<script src="./Krachten.js"></script>
<script src="./Dingen voor Main (Niet aankomen)/jquery-3.3.1.min.js"></script>
</body>
</html>