Как использовать GetElementById, чтобы получить не объект, а значение элемента? - PullRequest
Новая
       9

Как использовать GetElementById, чтобы получить не объект, а значение элемента?

0 голосов
/ 05 апреля 2020

Если я использую 

    console.log(document.getElementById("P1").value);
    console.log(document.getElementById("P2").value);
    console.log(document.getElementById("H1").value);

, чтобы получить значение трех входных данных (текст). Когда я использую эти console.log, я получу хороший ответ - элемент. Но когда я хочу назначить элемент 3 get по идентификатору 3 переменным, он говорит следующее: объект 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);
    }
};

1 Ответ

0 голосов
/ 05 апреля 2020

все значения равны нулю. установите значение на каждом входе, и все будет хорошо go. Кроме того, вы можете ввести значения в поле ввода 

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>
...